コントローラのビューモデル値は、私のSPA FETCH POSTからヌルとして受け取られます。

Question

私は自分のSPAから私のAsp.netコントローラにPOSTを行っています。コントローラは、このセットアップを持っています

[HttpPost] 
    [AllowAnonymous] 
    public async Task<IActionResult> Get([FromForm] LoginViewModel model) 
    { 

私のasp.netのコアAPIログインのviewmodelは次のとおりです。

public class LoginViewModel 
{ 
    public string Username { get; set; } 
    public string Password { get; set; } 
} 

私のSPAは活字体で書かれています。

マイSPAインターフェイスは、次のとおりです。

interface userLogin { 
    Username: string; 
    Password: string; 
} 

と私はそのように宣言します。

// Lets do a fetch! 

    console.log("username, password: ", this.username, this.password); 

    this.login.Username = this.username; 
    this.login.Password = this.password; 

    console.log("login.username, login.password", this.login); 
    console.log("JSON login: ", JSON.stringify(this.login)); 

    const task = fetch("/api/jwt", { 
    method: "POST", 
    body: JSON.stringify(this.login), 
    headers: { 
     "Content-Type": "application/json;charset=UTF-8" 
    } 

注：に設定

private login: userLogin, 

、私のFETCHはこれが構成されていますPOSTMANはこれで動作します。これらのコンソールログを見ると

：ここ

username, password: admin password 
login.ts:37 login.username, login.password {Username: "admin", Password: "password"} 
login.ts:38 JSON login: {Username: "admin", Password: "password"} 

は、ペイロードを示すChromeでネットワーク]タブで：

は最後にここでの値を示すブレークで一時停止コントローラがありますPOSTがnullおよびnullの場合：

POSTをフェッチする際にnullが発生するのはなぜですか？ APIで値を受け取るにはどうすればよいですか？

Answer 1

コンテンツタイプをapplication/jsonと明示的に指定し、オブジェクトのjson文字列化バージョンを送信しています。これにより、非同期呼び出しが行われたときに要求本体にデータが送信されます。したがって、FromBody属性を使用する必要があります。そのため、フレームワークはjsonオブジェクト/データをjson形式で含む要求からモデルバインディングを正しく行う方法を知っています。

変更FromBody

[HttpPost] 
[AllowAnonymous] 
public async Task<IActionResult> Get([FromBody] LoginViewModel model) 
{ 
    // to do : Return something 
}