ASP.NETコアでJSONを使用してコントローラにモデルを投稿する

Question

私はASP.NET Coreを初めて使用しています。コントローラにビューモデルを投稿しようとしています。

モデル：

public class ToolModel 
{ 
    public ToolModel() { } 
    public string text { get; set; } 
    public string type { get; set; } 
    public string name { get; set; } 
} 

コントローラ

[HttpPost("/Utilities/Tool/{type}/{process}")] 
public IActionResult ToolProcess(ToolModel model, string type, string process) 
{ 
    var test = model.text; 
    var result = new Services.ToolServices().exec(model, type, process); 
    return Ok(result); 
} 

ビュー

var model = { 
    text: "Test_text", 
    type: "test", 
    name: "test_name" 
} 

function post(model) { 
    var url = '/Utilities/Tool/Test/Edit'; 
    $.ajax({ 
     url: url, 
     data: JSON.stringify(model), 
     type: 'POST', 
     success: function() { 
      alert("all good"); 
     }, 
     error: function() { 
      alert(":("); 
     } 
    }); 
} 

私は現在、Bを取得することができますよ私のコントローラ内のレークポイントは、モデル値はnullです。私は[FromBody]をコントローラ引数に追加するなど、このプロセスのさまざまな組み合わせを試しました。私が[FromBody]を追加すると、私のブレークポイントにはまったく到達せず、リクエストは失敗し、 "No element found"というエラーが表示されます。

最初は、私のインデックスコントローラで私のビューにToolModelモデルを渡そうとしましたが、私のビューからモデルにデータを接続する方法を理解できませんでした（設定しようとしました@ Model.text = "test "成功なし）。それはうまくいきませんでしたので、モデルをJavaScriptオブジェクトとして複製しました。私が読んだことに基づいて、jsonを投稿すると自動的にモデルにバインドされるはずです。

私はASP.NET Coreの初心者です。私はGoogleに何が知られていなくても、投稿のすべてのバリエーションは私のために失敗します。私のモデルを使って、私のビューから私のコントローラにデータをどのように取得するのですか？みんな違ったやり方をしているようだ。

Answer 1

POSTリクエストを介してデータを送信しているので、データはリクエスト本体に送信されます。 MVCフレームワークにリクエスト本体から読み込ませるように指示する必要があります。これを行うには、[FromBody]属性でパラメータを飾ることができます。

また、typeパラメータを削除すると、ToolModelクラスに同じ名前のプロパティがあるためです。属性ルート定義からも削除することができます。

[HttpPost("/Utilities/Tool/{process}")] 
public IActionResult ToolProcess([FromBody] ToolModel model, string process) 
{ 
    var test = model.text; 
    var result = model; 
    // to do : Add your custom code here 
    return Ok(result); 
} 

clent側では、受信しているタイプと処理方法をサーバーが認識するように、contetTypeヘッダーを指定する必要があります。 ajax呼び出しのcontentType値として "application/json"を指定します。私が見る何

var url = '/Utilities/Tool/Edit'; 
$.ajax({ 
    url: url, 
    data: JSON.stringify(model), 
    contentType:"application/json", 
    type: 'POST', 
    success: function (r) { 
     alert("all good"); 
     console.log(JSON.stringify(r)); 
    }, 
    error: function() { 
     console.log('errr'); 
    } 
}); 

Answer 2

あなたはモデルパラメータとしてポスト機能を持っているです。提供しない場合は、nullとなります。

URLには/Test/Editは必要ありません。身体の内部にあるので、理想的です。ここで

は、私がテストした方法です -

<button type="button" onclick="post();">Post Data</button> 
<script> 
    var model = { 
     text: "Test_text", 
     type: "test", 
     name: "test_name" 
    } 

    function post() { 
     var url = '/Utilities/Tool'; 
     $.ajax({ 
      url: url, 
      data: JSON.stringify(model), 
      type: 'POST', 
      contentType: "application/json", 
      success: function() { 
       alert("all good"); 
      }, 
      error: function() { 
       alert(":("); 
      } 
     }); 
    } 
</script> 

[HttpPost("/Utilities/Tool")] 
public IActionResult ToolProcess([FromBody]ToolModel model) 
{ 
    model.text += "Return From Server"; 
    return Ok(model); 
}