使用 jquery ajax 上传文件答案

【问题标题】：file upload using jquery ajax使用 jquery ajax 上传文件
【发布时间】：2012-08-15 07:17:38
【问题描述】：

我想上传一张带有如下描述的图片：

data = '{"filename":"' + myfilename + '", "file":"' + file + '", "description":"' +
    description + '"}';

$.ajax({
    type: "POST",
    url: "filehandler.ashx",
    data: data,
    success: function (result) {
        alert(result);
    },
    error: function () {
        alert("There was error uploading file!");
    }
});

我该怎么做？我无法在通用处理程序中将文件读取为HttpPostedFile。 context.Request.Form 也没有任何密钥。

【问题讨论】：

请添加有问题的代码
@AmiramKorach 我不知道如何编写处理程序来分别获取文件和描述。
使用此代码，我看不出您如何上传任何内容。这是一个包含字符串的 js 对象的帖子。不幸的是，无法以这种方式上传文件。基本上，设置文件名是浏览器的工作（出于安全原因）。现在也许我没有得到你的 sn-p。

标签： c# json jquery generic-handler

【解决方案1】：

对不起，如果我没有完全发布我的问题。无论如何，我得到了它的工作。

var data = new FormData();

data.append("name", filename);
data.append("file", file);

在通用处理程序中

HttpPostedFile file = context.Request.Files["file"];
string fileName = context.Request.Form["filename"];

Using FormData Objects

【讨论】：

虽然只能在最近的浏览器中使用，但是由于 IE10 现在也可以在 Win7 上使用了 :)

【解决方案2】：

您不能使用 ajax 发布文件，您必须将其发布到 iframe 中才能获得相同的结果

这就是我所做的

var form = "#myform";
var url = "http://post.it/";
var iframeName = 'iframePost' + (new Date()).getTime(); 
$('<iframe id="'+iframeName+'" name="' + iframeName + '" style="display:none;"/>').appendTo('body');
$(form).attr('target',iframeName)
    .attr('action',url)
    .attr('enctype','multipart/form-data')
    .append('<input type="hidden" name="_iframe" value="' + iframeName + '" />');
    form.submit();

要有一个回调，让 iframe 返回一个类似

的脚本

window.parent.callBack(data);

【讨论】：