2017-06-13 6 views
1

jQueryの$.ajax()を使用するコードがあります。AJAXとデータフォーマットの問題

データをJSON.stringify()に渡す必要があることがわかりました。

$.ajax({ 
    url: '/Resource/ReportError', 
    type: 'POST', 
    data: JSON.stringify({ 
     ResourceId: popup.data('id'), 
     Reason: reason, 
     Description: $('#report-error-description').val(), 
     Email: $('#report-error-email').val() 
    }), 
    contentType: 'application/json; charset=utf-8', 
    success: function (data) { 
     // ... 
    }, 
    error: function() { 
     // ... 
    } 
}); 

これまでのところ、とても良いです。しかし、今はIDを渡すだけでデータを取得しています。だから私は代わりにGETを使用しなければならないと思った。

$.ajax({ 
    url: '/Resource/GetInitialReviewData', 
    type: 'GET', 
    data: JSON.stringify({ resourceId: resourceId }), 
    contentType: 'application/json; charset=utf-8', 
    success: function (data) { 
     // ... 
    }, 
    error: function() { 
     // ... 
    } 
}); 

しかし、これはresourceIdは、サーバー上のnullあることについてのエラーで失敗します。

JSON.stringify()へのコールを削除した場合、正常に機能します。

data: { resourceId: resourceId }, 

誰もが理解しやすい方法でこれを説明できますか? POSTの場合はJSON.stringifyが必要ですが、の場合はGETが必要です。

+2

必要()'のための

.../Resource/GetInitialReviewData{"resourceId":"someValue"} 

のURLを生成しますあなたのモデルのプロパティがシンプルな型の場合はPOSTを行います(ただし、 'contentType: 'application/json; charset = utf-8'、'を削除する必要があります) 'contentType: 'application/json; charset = utf- 'はGETで無意味です(ボディはありません) –

+0

@StephenMuecke:ここで私を混乱させる' contentType'ですか?このコメントをもう少し詳しくお話したいと思います答えに。 –

+0

私は小さな本の章を書くことなくそれを行う方法について考える必要があります –

答えて

1

JSON.stringify()をPOSTに使用する必要はありませんが、手動で生成する複雑なタイプや配列(c#ドットとインデクサーの表記法と一致しない場合は除く)は一般的に不要です。 $.ajax()メソッドのデフォルトのcontentTypeは、'application/x-www-form-urlencoded; charset=UTF-8'です。これは、本質的に成功したフォームコントロールの名前/値のペアの巨大なクエリ文字列に似ています。どのように見えるかを確認するには、console.log($('form').serialize());を使用してください。

contentTypeを省略すると、文字列化せずにオブジェクトを使用できます。

$.ajax({ 
    url: '/Resource/ReportError', 
    type: 'POST', 
    data: { 
     ResourceId: popup.data('id'), 
     Reason: reason, 
     Description: $('#report-error-description').val(), 
     Email: $('#report-error-email').val() 
    }, 
    success: function (data) { 

DefaultModelBinderは、あなたのメソッドのパラメータにデータを読み込み、バインドするFormValueProviderを使用します。

あなたがJSON.stringify()を使用する場合、それはJSON形式のテキストにあなたのオブジェクトに変換 - 名前/値のペアを含む巨大な文字列(結果の値の前後に引用符を気づく)、あなたの方法では、単一のstringのパラメータを持っていることによって、これを受け取ることができますそれを自分でデシリアライズします。 contentType: 'application/json; charset=utf-8'を追加することによって、DefaultModelBinderJsonValueProviderFactoryを使用して文字列を読み取り、それを逆シリアル化して(JavaScriptSerializerを使用)、データをメソッドパラメータにバインドします。

DefaultModelBinderはクエリ文字列(またはルート値)の値のみを読み込むため、GETの場合は本文がなく、contentTypeオプションは適用されません(無視されます)。あなたの$.ajax() GET呼び出しでJSON.stringify()を使用することにより、maddockstの答えで述べたように、あなたの代わりにあなたが `JSON.stringifyを必要としない

.../Resource/GetInitialReviewData?resourceId=someValue 
3

type: 'GET'と組み合わせて使用​​すると、data属性は、指定された値をクエリ文字列に変換してURLに追加します。あなたがデータ{name: 'Tom'}とURL http://www.test.comと呼ばれるのであれば、あなたは以下のURLで終わるだろう:あなたは、文字列を渡すと

http://www.test.com?name=Tom 

、その文字列が結果のURLようURLに追加されますJSON.stringifyを呼び出すときでしょう:

http://www.test.com{"name":"tom"} 

あなたはtype: 'POST'dataを使用する場合、dataは、要求の本体に送信されます。要求の本文は文字列である必要があり、JSON.stringifyへの呼び出しの理由です。

+0

最後の段落は正しくありません。デフォルトの 'contentType'は' 'application/x-www-form-urlencodedです。 charset = UTF-8''(名前と値のペアの集合) –

+0

@StephenMueckeありがとう、私はそれを削除しました。 – maddockst