IE tries to download json response while submitting jQuery multipart form data containing file

问题

I'm trying to submit a form with a file field in it via jQuery.Form plugin, here's the code:

$('form').ajaxSubmit({
  url: "/path",
  dataType: "json",
  contentType: "multipart/form-data"
...

The server then returns json as a response. Works great in all browsers except IE, which tries to download the response as a file. If I remove the file field from the form, it also works just fine.

I've seen various solutions here and in Google and basically tried almost everything described, including setting enctype for the form via jQuery, but it didn't work.

Any suggestions would be very welcomed.

回答1:

You can simply return JSON from the controller as "text/html" and then parse it on the client side using JQuery.parseJSON().

Controller:

    return this.Json(
            new
                {
                    prop1 = 5,
                    prop2 = 10
                }, 
            "text/html");

Client side:

jsonResponse = $.parseJSON(response);

if(jsonResponse.prop1==5) {
     ...
}

This solution has been working for me.

回答2:

I have not found a direct solution to this, but I eventually implemented the following workaround: I used dataType: "text" in my ajax settings and then returned plaintext from controller, separating values with ; and parsing them on the client side. That way IE and Forefox stopped trying to download a response.

I did not find any other way to prevent said behavior other then to return plaintext. I tried returning JSON as plaintext and then parsing it with $.parseJSON, but it didn't work due to some js errors.

回答3:

Just send response with 'Content-Type', 'text/html' header.

回答4:

Just set Content-Type: text/html

This happens because IE8 doesn't recognize application/... mimetype. This works for me.

Hope it helps.

回答5:

Same situation than you folks : the problem only occurs with enctype="multipart/form-data" form used with $(form).ajaxSubmit(...) function.

My team and I had to replace (in this function) dataType: 'json' option with dataType: 'text' and add responseText = $.parseJSON(responseText); to force server response parsing.

Of course we also had to step in server side to return a response with "text/plain" header instead of "application/json"

We're not proud of it :( IE is definitely killing everything...

I didn't try the advice given by zmonteca (already spent too much time on it) but it seems worthy : let us know if it was OK for you.

Hope it helps!

回答6:

if you work with Zend you can do

$this->getResponse()->setHeader('Content-Type', 'text/html');

in your controller action. and on client-side, in case of jQuery, you can do

data = $.parseJSON(data);

回答7:

This site has some info about wrapping the response in a http://forum.jquery.com/topic/jquery-form-malsup-ie7-file-download-security-warning-on-ajax-file-upload

I seemed to be able to fix my problem by making my server return the JSON as a string. Then I used JSON.parse() inside the complete event.

回答8:

I came up with the following workaround (in Zend Framework):

if (!$this->_request->isXmlHttpRequest()) {
    die('<textarea>'.Zend_Json::encode($data).'</textarea>');
}
$this->view->assign($data);

回答9:

Removing ContentType from serverside works for me.

来源：https://stackoverflow.com/questions/8151138/ie-tries-to-download-json-response-while-submitting-jquery-multipart-form-data-c