web-dev-qa-db-ja.com

リソースはドキュメントとして解釈されますが、MIMEタイプapplication / jsonでChrome Developer Tools

次のスニペットがあり、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実装は正常に機能しています。しかし、私は警告を受けています

ドキュメントとして解釈されるが、MIMEタイプapplication/jsonで転送されるリソース

in Chrome開発者ツール。警告、またはさらに良い方法で、それを解決する方法を見つけたい。

代わりに$.postを使用するように変更し、それ以降魔法のようにエラーがなくなりました。 $.postは機能するが$form.ajaxSubmitは機能しない理由がわかりません。誰かが説明を提供できれば、それは素晴らしいことです。少なくとも、この問題は解決されています。以下は新しいコードです。

var url = $form.attr("action");
$.post(
  url, 
  $form.serialize(), 
  function(data) {
    alert("success");
  },
  "json"
);
jquerygoogle-chrome-devtoolsjquery-forms-plugin
41
tamakisquare

私は別のアプローチを取りました。私は$ .postを使用するように切り替えましたが、それ以来エラーはなくなりました。

2
tamakisquare

私は同じエラーに直面していました。私のために働いた解決策は次のとおりです。

サーバー側から、JSON応答を返しながら、コンテンツタイプを変更します：text/html

これで、ブラウザ（Chrome、Firefox、IE8）でエラーが発生しなくなりました。

20
HB.

このタイプの警告は、通常、リクエスト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ライブラリラッパーを介してプログラムでのみ送信できます。

10
Kudehinbu Oluwaponle

JavaScriptライブラリではなく、Chromeの実際の動作です。修正方法は次のとおりです。

メッセージが表示されないようにし、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);
4
John

これは私に起こり、私がこれを削除すると：enctype = "multipart/form-data"警告なしで動作し始めました

1
daviddv

送信する前にJSON.stringify（options）を使用してJSONオブジェクトを文字列に変換し、警告を無視して正常に動作することができます。

0
driftcrow