2016-07-27 5 views
0

Dropzoneを使用してFlaskアプリにファイルをアップロードするためのリソースを作成しています。ファイルがアップロードされると、アプリはhello worldページにリダイレクトされます。これは起こっていないし、ファイルをアップロードしたビューでアプリが停止しています。私はマスターからjQuery 3.1.0とDropzoneを使用しています。アップロード後、FlaskアプリにDropzoneがリダイレクトされない

from flask import Flask, request, flash, redirect, url_for render_template) 
from validator import Validator 

ALLOWED_EXTENSIONS = set(['csv', 'xlsx', 'xls']) 

def allowed_file(filename): 
    return (filename != '') and ('.' in filename) and \ 
      (filename.split('.')[-1] in ALLOWED_EXTENSIONS) 

def create_app(): 
    app = Flask(__name__) 
    app.secret_key = 'super secret key' 
    return app 

app = create_app() 

@app.route('/') 
def index(): 
    return render_template('index.html') 

@app.route('/world') 
def hello_world(): 
    return render_template('hello_world.html') 

@app.route('/upload', methods=['POST']) 
def upload(): 
    # check that a file with valid name was uploaded 
    if 'file' not in request.files: 
     flash('No file part') 
     return redirect(request.url) 
    file = request.files['file'] 
    if not allowed_file(file.filename): 
     flash('No selected file') 
     return redirect(request.url) 

    # import ipdb; ipdb.set_trace() 
    validator = Validator(file) 
    validated = validator.validate() 
    if validated: 
     flash('Success') 
    else: 
     flash('Invalid file') 
    return redirect(url_for('hello_world')) 

if __name__ == '__main__': 
    app.run(debug=True) 
{% extends "base.html" %} 

{% block head %} 
    <link href="/static/css/dropzone.css" rel="stylesheet"> 
    <script src="/static/js/dropzone.js"></script> 
{% endblock %} 
{% block body %} 
    <main> 
     <section> 
      <div id="dropzone"> 
       <form action="upload" method="post" class="dropzone dz-clickable" id="demo-upload" multiple> 
        <div class="dz-message"> 
         Drop files here or click to upload. 
        </div> 
       </form> 
      </div> 
     </section> 
    </main> 
{% endblock %} 
+0

私の解決策を確認し、[ここ](http://stackoverflow.com/a/42250213/5511849)! –

答えて

0

は私がドロップゾーンとあまり慣れていないんだけど、私はあなたのファイルのアップロードを使用して、私のフラスコアプリケーションの一つの例を提供します。私は標準のHTMLアップロードフォームを使用しています。うまくいけば、あなたは何が起こっているのかを知ることができるはずです。

注:私はファイルのアップロードにテンプレートを使用していません。

def index(): 
    return """<center><body bgcolor="#FACC2E"> 
    <font face="verdana" color="black"> 
    <title>TDX Report</title> 
    <form action="/upload" method=post enctype=multipart/form-data> 
    <p><input type=file name=file> 
    <input type=submit value=Upload> 
    </form></center></body>""" 

# here is my function that deals with the file that was just uploaded 
@app.route('/upload', methods = ['GET', 'POST']) 
def upload(): 
    if request.method == 'POST': 
     f = request.files['file'] 
     f.save(f.filename) 
     # process is the function that i'm sending the file to, which in this case is a .xlsx file 
     return process(f.filename) 

私はポストファイルアップロード用のルートパスを設定するよどここの行は次のとおりです。

<form action="/upload" method=post enctype=multipart/form-data> 

あなたの問題があること、この行することができます <form action="upload" method="post" class="dropzone dz-clickable" id="demo-upload" multiple>upload/が不足しています。

0

私は私のフラスコアプリケーションで同様の問題があったと私は、次のjQueryの機能とそれを解決:

Dropzone.options.myDropzone = { 

autoProcessQueue: false, 

init: function() { 
    var submitButton = document.querySelector("#upload-button"); 
    myDropzone = this; 

    submitButton.addEventListener("click", function() { 
     myDropzone.processQueue(); 
    }); 

    this.on("sending", function() { 
     $("#myDropzone").submit() 
    }); 
    } 
}; 

パラメータファイルは、私は私のドロップゾーンのフォームを送信することができますので、送信される直前に呼び出され、「送信します」。これで、私のフラスコのアプリケーション内のすべてのリダイレクトが正常に動作します。明確にするための私のhtmlコードの

ワンピース:

<form action="/" method="POST" class="dropzone" id="myDropzone" enctype="multipart/form-data"> 

</form> 
関連する問題