通过 Ajax FormData() 发送文件和字符串



我正在尝试使用Ajax中的FormData((函数将文件和字符串上传到MongoDB。我知道Ajax倾向于字符串化所有传递的数据,除非我们设置processData: false,因此我必须对文件和字符串使用FormData。

网页代码段

<h5 class="modal-title h5Modal" id="htmlIP"></h5>
<div class="form-group">
<label for="fileUpload">Choose a File To Upload:</label>
<input type="file" id="fileUpload" accept="image/*,.pdf,.pptx" class="file-path">
</div>
<div class="modal-footer">
<button class="btn btn-primary submitFile" data dismiss="modal" > Submit </button>
</div>

def FileSubmit(request):
if request.method == "GET":
ip = request.GET['IP']
file = request.GET['fileUpload']
else:
ip = ''
res = Pc.uploadToDB(ip, file)

data = {
'version' : res,
}
return JsonResponse(data)        

其中,uploadToDB函数在MongoDB中查找具有提供的ip的文档并更新文件字段。

这是我的Ajax函数:

$(document).ready(function() {
$('.submitFile').on('click,function(){
var rowID = $('#htmlIP').text();
formdata = new FormData();
var file = document.getElementById('fileUpload').files[0];
formdata.append('file', file);

$.ajax({
type: "GET",
url: 'FileSubmit/' + rowID,
//data: {
//    'IP': rowID,
//    'fileUpload': file,
//},
data: formdata,
processData: false,
contentType: false,
success: function(data){
alert(data.version);
window.location.reload();
},
error: function(err){
alert(err);
}
});
});
});

如您所见,我已经注释掉了我使用数据的第一种方法。

当我尝试使用这些函数上传文件时,出现以下错误:

Not Found: Path/to/FileSubmit/XXX.XXX.XXX.XXX

这是可以理解的,因为我在不应该的时候提供了 rowID 作为 url。但这是我最接近能够正确获取文件和 ip 的方法。

每当我摆脱 url 中的 rowID 并尝试不同的解决方案时,我都会收到指向请求的相同以下错误。用 Python 编写的 GET 行:

MultiValueDictKeyError: "u'IP'"

这意味着它无法正确读取 IP。

我已经查看了通过 JQuery AJAX 一起发送表单数据和字符串数据中提供的大多数答案? 但是,不幸的是,他们中的大多数都没有帮助我,因为它们专注于上传字符串数组而不是一个实例。

有没有办法将字符串附加到表单数据或其他我不知道的方法?任何帮助或建议将不胜感激。

我认为问题出在您的 AJAX 请求类型上。 您应该发送POST文件请求。

$.ajax({
type: "POST",
...
});

最新更新