46

我有以下代码片段，它使用 jQuery Form 插件将表单发布到服务器（在 ajax 中）。

  var options = {
    dataType: "json",
    success: function(data) { 
      alert("success");
    } 
  }; 

  $form.ajaxSubmit(options);

表格：

<form enctype="multipart/form-data" id="name_change_form" method="post" action="/my_account/"> 
<div style='display:none'><input type='hidden' name='csrfmiddlewaretoken' value='6c9b552aaba88b8442077e2957e69303' /></div> 
  <table> 
    <tr> 
      <td> 
        <label for="id_first_name">First name</label>:
      </td> 
      <td> 
        <input name="first_name" value="Patrick" maxlength="30" type="text" id="id_first_name" size="30" /> 
      </td> 
    </tr> 
    <tr> 
      <td> 
        <label for="id_last_name">Last name</label>:
      </td> 
      <td> 
        <input name="last_name" value="Sung" maxlength="30" type="text" id="id_last_name" size="30" /> 
      </td> 
    </tr> 
  </table> 
  <input type="hidden" name="form_id" value="name_change_form" /> 
</form>

ajax 实现工作正常。但我收到警告

资源解释为 Document，但使用 MIME 类型 application/json 传输

在 Chrome 开发者工具中。我想找出警告的原因，甚至更好的解决方法。

我改为使用$.post，然后神奇地从那时起错误就消失了。我不知道为什么$.post有效但无效$form.ajaxSubmit。如果有人可以提供他们的解释，那就太好了。至少，这个问题得到了解决。下面是新代码。

var url = $form.attr("action");
$.post(
  url, 
  $form.serialize(), 
  function(data) {
    alert("success");
  },
  "json"
);
4

7 回答 7

21

我面临同样的错误。对我有用的解决方案是：

从服务器端，在返回 JSON 响应时，更改 content-type: text/html

现在浏览器（Chrome、Firefox 和 IE8）不会出错。

于 2011-08-13T21:01:37.880 回答
16

由于请求 HTTP 标头，通常会标记此类警告。特别是 Accept 请求标头。 HTTP 标头的 MDN 文档状态

The Accept request HTTP header advertises which content types, expressed as MIME types, the client is able to understand. Using content negotiation, the server then selects one of the proposals, uses it and informs the client of its choice with the Content-Type response header. Browsers set adequate values for this header depending of the context where the request is done....

application/json 可能不在浏览器发送的 Accept 标头中的 MIME 类型列表中，因此会发出警告。

解决方案

自定义 HTTP 标头只能通过 XMLHttpRequest 或任何实现它的 js 库包装器以编程方式发送。

于 2017-05-29T19:51:26.563 回答
7

这实际上是 Chrome 中的一个怪癖，而不是 JavaScript 库。这是修复：

为了防止消息出现并允许 chrome 在控制台中将响应很好地呈现为 JSON，请将查询字符串附加到您的请求 URL。

例如

var xhr_object = new XMLHttpRequest();

var url = 'mysite.com/'; // Using this one, Chrome throws error

var url = 'mysite.com/?'; // Using this one, Chrome works

xhr_object.open('POST', url, false);
于 2011-09-30T10:26:46.597 回答
2

我采取了不同的方法。我改用 $.post ，从那以后错误就消失了。

于 2011-08-16T17:15:20.623 回答
1

这发生在我身上，一旦我删除了这个： enctype="multipart/form-data" 它开始工作而没有警告

于 2013-09-29T11:05:12.767 回答
0

您可以在提交之前简单地使用 JSON.stringify(options) 将 JSON 对象转换为字符串，然后警告关闭并正常工作

于 2012-09-27T15:40:57.123 回答
-2

使用dataType: "jsonp". 我之前也有同样的错误。它为我修好了。

于 2013-01-15T07:40:05.487 回答