为什么ajax将FormData放入request.data而不是request.files？答案

【问题标题】：Why ajax put FormData into request.data instead of request.files?为什么ajax将FormData放入request.data而不是request.files？
【发布时间】：2017-06-29 13:13:28
【问题描述】：

Flask，我想通过 HTML 中的 AJAX 调用上传图像文件。

我写了这个 Javascript：

function mysubmit(input){
    var file_input = document.getElementById('file-input-left');
    var form_data = new FormData();
    var file = file_input.files[0];
    alert(file);
    form_data.append('file', file);
    $.ajax({
        type: 'POST',
        url: '/calc_full_result',
        data: form_data,
        contentType: false,
        cache: false,
        processData: false,
        async: false,
        success: function(data){
            alert('Success!');
        },
    });
}

还有 HTML：

<div class="image-holder">
    <form action="/calc_full_result" id="upload-form-left" name="form-left" method=post enctype=multipart/form-data>
    <div class="image-holder-left">
        <div class="image-upload">
        {% if img_left %}
        <label id="upload-left-label" for="file-input-left"><img id="left-image" src="data:image/png;base64, {{img_left}}"/></label>
        {% else %}
        <label id="upload-left-label" for="file-input-left"><img id="left-image" src="{{url_for('static', filename='upload_fill.png')}}" /></label>
        {% endif %}
        <input id="file-input-left" type=file name=file onchange="mysubmit(this)"/>
        </div>
    </div>
    <form action="/calc_full_result" id="upload-form-right" name="form-right" method=post enctype=multipart/form-data>
    <div class="image-holder-right">
        <div class="image-upload">
        {% if img_right %}
        <label id="upload-right-label" for="file-input-right"><img id="right-image" src="data:image/png;base64, {{img_right}}"/></label>
        {% else %}
        <label id="upload-right-label" for="file-input-right"><img id="right-image" src="{{url_for('static', filename='upload_fill.png')}}"/></label>
        {% endif %}
        <input id="file-input-right" type=file name=file onchange="mysubmit(this)"/>
        </div>
    </div>
    </form>
</div>

然后在 app.py 中：

@app.route('/calc_full_result', methods=['POST'])
def calc_full_result():
    if request.method == 'POST':
        file = request.files['file']
        return jsonify(result="suc")

但我无法获取目标文件，它始终为空且无法保存。当我检查请求时，我可以看到len(request.data) 几乎是图像文件的大小。我想知道为什么request.files 是空的以及如何将文件保存在request.data 中？有可能吗？

【问题讨论】：

标签： ajax flask upload

【解决方案1】：

试试：

data: new FormData(document.getElementById('upload-form-left'))

【讨论】：

它对我不起作用。无论输入或表单中的新FormData，它都是一样的。
你为什么有async: false？
其实我是从一个demo中学习到这段代码的，将async设置为true会有帮助吗？我想试试，先谢谢你
好吧 ajax 在绝大多数情况下都是异步的，对于文件上传，async false 没有任何意义。实际上同步xhr是deprecated。您是否尝试使用 file.save ("/some/path/file") 将文件保存在控制器中？