问题描述
我正在使用 XMLHttpRequest
将文件从 javascript
代码发送到 django 视图
.我需要检测该文件是否已被发送或如果发生错误.我使用 jquery 编写以下 javascript.
I am using XMLHttpRequest
to send a file from javascript
code to a django view
.I need to detect,whether the file has been sent or if some error occurred.I used jquery to write the following javascript.
理想情况下,我想向用户显示文件未上传的错误消息.有没有办法在 javascript
中做到这一点?
Ideally I would like to show the user an error message that the file was not uploaded.Is there some way to do this in javascript
?
我试图通过从 django view
返回 success/failure
消息来做到这一点,将 success/failed 消息
作为 json
并从 django 视图
发回序列化的 json.为此,我制作了 xhr.open()
non-asynchronous
.我试图打印 xmlhttpRequest
对象的 responseText
. console.log(xhr.responseText)
显示
I tried to do this by returning a success/failure
message from django view
, putting the success/failed message
as json
and sending back the serialized json from the django view
.For this,I made the xhr.open()
non-asynchronous
. I tried to print the xmlhttpRequest
object's responseText
.The console.log(xhr.responseText)
shows
response= {"message": "success"}
我想知道的是,这是否是正确的方法.在许多文章中,我发现警告
What I am wondering is,whether this is the proper way to do this.In many articles,I found the warning that
不推荐使用 async=false
Using async=false is not recommended
那么,有没有什么办法可以在保持xhr.open()
异步的同时查出文件是否已经发送?
So,is there any way to find out whether the file has been sent,while keeping xhr.open()
asynchronous?
$(document).ready(function(){
$(document).on('change', '#fselect', function(e){
e.preventDefault();
sendFile();
});
});
function sendFile(){
var form = $('#fileform').get(0);
var formData = new FormData(form);
var file = $('#fselect').get(0).files[0];
var xhr = new XMLHttpRequest();
formData.append('myfile', file);
xhr.open('POST', 'uploadfile/', false);
xhr.send(formData);
console.log('response=',xhr.responseText);
}
我的 django
视图从表单数据中提取文件并写入目标文件夹.
My django
view extracts file from form data and writes to a destination folder.
def store_uploaded_file(request):
message='failed'
to_return = {}
if (request.method == 'POST'):
if request.FILES.has_key('myfile'):
file = request.FILES['myfile']
with open('/uploadpath/%s' % file.name, 'wb+') as dest:
for chunk in file.chunks():
dest.write(chunk)
message="success"
to_return['message']= message
serialized = simplejson.dumps(to_return)
if store_message == "success":
return HttpResponse(serialized, mimetype="application/json")
else:
return HttpResponseServerError(serialized, mimetype="application/json")
我在 @FabrícioMatté 的帮助下完成了这项工作
I got this working with the help of @FabrícioMatté
xhr.onreadystatechange=function(){
if (xhr.readyState==4 && xhr.status==200){
console.log('xhr.readyState=',xhr.readyState);
console.log('xhr.status=',xhr.status);
console.log('response=',xhr.responseText);
var data = $.parseJSON(xhr.responseText);
var uploadResult = data['message']
console.log('uploadResult=',uploadResult);
if (uploadResult=='failure'){
console.log('failed to upload file');
displayError('failed to upload');
}else if (uploadResult=='success'){
console.log('successfully uploaded file');
}
}
}
推荐答案
XMLHttpRequest
对象包含 status
和 readyState
属性,您可以在 xhr.onreadystatechange
事件中进行测试以检查您的请求是否成功.
XMLHttpRequest
objects contain the status
and readyState
properties, which you can test in the xhr.onreadystatechange
event to check if your request was successful.
这篇关于如何确定 XMLHttpRequest.send() 是否有效的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!