Blazor Server 發起HttpPost請求，但是多引數

LinSr發表於2023-09-21
BlazorServerHTTP

一、介紹

今天突然想起之前工作上遇到的一個問題，在做Blazor 開發時後端給的一個介面請求方式是Post ，但是他需要攜帶多個引數，新建一個公共類又覺得麻煩，我就嘗試著怎麼在Post請求中攜帶多個引數，由於接觸Asp .Net Core 的時間不夠長，所以這些都不是太瞭解, 今天寫下這篇文章做個記錄，以免以後用到的時候忘記。如果有什麼不對的地方，或者有更好的方法，大家可以在評論區發出來，大家一起學習。

二、程式碼實現

後臺就寫一個最簡單的Post介面，引數暫且先填兩個引數，同時這兩個引數使用[FromForm]特性，表示這個資料是表單傳過來的資料。

FromForm: 在Action方法傳入引數後新增[FromForm]屬性，引數將以表單【key:value對Array組】的形式提交。

     [HttpPost]
     public async Task<ActionResult<string>> PostMultipleParameters([FromForm] int age, [FromForm] string name)
     {
         var form = $"age:{age},name:{name}";
         return Ok(form);

     }

同樣，Blazor Server 也是寫一個最簡單的HttpPost請求，從後臺的Swagger 可以看到，這個請求體是 multipart/form-data，所以我們在請求的時候也需要建立一個相對應的正文，這裡我們用MultipartFormDataContent型別來作為我們請求的正文。

@code {
    protected override async Task OnInitializedAsync()
    {
        using (var httpClient = new HttpClient())
        {
            MultipartFormDataContent formDataContent = new();
            formDataContent.Add(new StringContent("LinSr"), "name");
            formDataContent.Add(new StringContent("80"), "age");
            await httpClient.PostAsync("http://localhost:5001/api", formDataContent);
        }
    }
}

當Blazor Server 程式執行起來，OnInitializedAsync方法被呼叫時，後臺收到的請求資料如下，證明我們從Blazor Server 發起的HttpPost請求後臺已收到。

三、總結

上述是Blazor Server 發起HttpPost請求攜帶多個引數的一個簡單例子，方法應該還有很多種，但我始終相信學習是一個循序漸進的過程，現在自身能力有限，先從簡單的開始吧，如果大家還有更好的方法，也望大家不吝賜教，在評論區發出來，大家一起學習。

相關文章