首页 > 解决方案 > 如何从 FormData 请求多个参数?

问题描述

这是来自这里的后续问题:在那里我学会了如何上传文件,处理它,然后使用它的内容再次填充网站AJAXFormData。例如,如果我有这样的文件data.csv

A,B,C
1,3,4
2,4,2

我可以使用AJAX和传递它FormData

<form method="POST" enctype="multipart/form-data" id="fileUploadForm">
    <div class="custom-file">
       <input id="myfile" name="myfile" type="file" class="custom-file-input">

       <label for="myfile" class="custom-file-label">
         Choose file...
       </label>
    </div>
</form>

// the javascript part
var form = $('#fileUploadForm')[0];
var formdata = new FormData(form);

$.ajax({
        type: "POST",
        enctype: 'multipart/form-data',
        url: "/_get_table",
        data: formdata,
        processData: false,
                contentType: false,
                cache: false,
                timeout: 600000,

并得到:

在此处输入图像描述

然后我可以轻松地使用

file = request.files['myfile']

并使用将其转换为数据框

df = pd.read_csv(file)

我现在的问题是,如果我想传递其他参数(不仅仅是文件),我将如何做到这一点。这里建议使用

var formdata = new FormData();
formdata.append("myform", form)
formdata.append("myvalue", 10)

这使

在此处输入图像描述

headers

在此处输入图像描述

我现在如何正确收集信息?我可以myvalue这样

val = request.form['myvalue']

但我还没有找到访问和阅读的方法myfile。如果我尝试

file = request.files['myform'] 

我明白了

werkzeug.exceptions.HTTPException.wrap..newcls:400 错误请求:KeyError:'myform'

我还尝试了其他解决方案,没有成功。

标签: pythonajaxflaskrequestform-data

解决方案


问题是因为您没有FormData正确添加文件。

当您使用multipart/form-data时,您的有效负载应该是一个文件和一些form-data. 但是在您的屏幕截图中,如您所见,您添加了一个object.

要解决这个问题,实际上你可以直接将你的值添加到原来的FormData

var formdata = new FormData(form); 
formdata.append("myvalue", 10);

推荐阅读