文件上传后的JSON回调

时间:2013-04-15 17:50:17

标签: ajax json upload

我在尝试通过json / ajax上传文件时遇到问题,并且看起来不像是上传了文件。控制台输出中仅显示该文件的名称。

我的html代码如下所示。

<form action="/cgi-bin/upload.cgi" method="post" enctype="multipart/form-data" target="upIFrame"> 

<input type="file" id="uploadFileName" name="uploadFileName" size="30" >&nbsp;                                                                                                                                                                                                                                                                                                          
<input type="button" id="upgradeFile" name="upgradeFile" value="Upload" onclick="ul.load()" />
<iframe id="upIFrame" name="upIFrame" src="#" style="display: none;"></iframe>
</form>

ul.load()在下面调用这一行,最终transfer.ajax代码将调用

transfer.ajax({
               url:'upload.cgi', 
               data:{filename: ul.filename}, 
               success: success, 
               error: error, 
               async: true 
});

ul.filename来自uploadFileName

和transfer.ajax代码如下所示

transfer = {
ajax: function(p) {        
if (p.url.indexOf('/') == -1) {
  p.url = '/cgi-bin/' + p.url;
}
p.type = 'POST';
p.contentType = 'application/json';  
p.dataType = 'json';
p.cache = false;

if (p.data != undefined) {
    p.data = JSON.stringify(p.data);
}

$.ajax(p);
}
};

在Fire Fox中查看后的结果是 JSON

filename   "file.tgz"

来源

{"filename":"file.tgz"}

有些人可以告诉我我做错了什么或错过了什么吗?

TIA

我将代码修改为以下内容......

var fd = new FormData();
fd.append("filename",ul.filename);
$.ajax({
  url: "/cgi-bin/test.cgi",
  type: "POST",
  data: fd,
  processData: false,  // tell jQuery not to process the data
  contentType: false,   // tell jQuery not to set contentType
  beforeSend : function(xhr){                           
xhr.setRequestHeader('Content-Disposition', 'form-data; name=\"uploadFileName\"; filename=\"' + ul.filename + '\"');
},

});

和Fire Fox中的请求标题为

Accept-Encoding gzip, deflate
Accept-Language en-US,en;q=0.5
Content-Disposition form-data; name="uploadFileName"; filename="test.tgz"
Content-Length  157
Content-Type    multipart/form-data; boundary=---------------------------20025277823050
X-Requested-With    XMLHttpRequest

但“发布”会显示以下内容

来源 ----------------------------- 20025277823050 Content-Disposition:form-data; name =“filename”

test.tgz ----------------------------- 20025277823050 -

我如何包含filename =“test.tgz”?缺少什么?

TIA

1 个答案:

答案 0 :(得分:0)

你能试试吗,

var fd = new FormData();
fd.append("filename",ul.filename);`enter code here`
$.ajax({
  url: "/cgi-bin/test.cgi",
  type: "POST",
  data: fd,
  processData: false,  
  contentType: false,   
  beforeSend : function(xhr){                           
xhr.setRequestHeader('Content-Disposition', 'form-data; name=\"' + ul.filename + '\"; filename=\"' + ul.filename + '\"');
}
});

我认为name属性应该是文件名。 谢谢:)。