Blazor Server 应用程序中进行 HTTP 请求 (2)

HolidaysExplorer.razor

@page "http://www.likecs.com/" <h3>Holidays Explorer</h3> <br /> <EditForm Model="@HolidaysModel" OnValidSubmit="@HandleValidSubmit"> <label>Country Code:</label> <InputText @bind-Value="HolidaysModel.CountryCode" /> <label>Year:</label> <InputNumber @bind-Value="HolidaysModel.Year" /> <button type="submit">Submit</button> </EditForm> <br /> @if (Holidays.Count > 0) { <table> <thead> <tr> <th>Date</th> <th>Name</th> <th>Local Name</th> <th>Country Code</th> <th>Global</th> </tr> </thead> <tbody> @foreach (var item in Holidays) { <tr> <td>@item.Date.Value.ToShortDateString()</td> <td>@item.Name</td> <td>@item.LocalName</td> <td>@item.CountryCode</td> <td>@item.Global</td> </tr> } </tbody> </table> }

此时如果您运行该应用程序，您将看到一个不显示任何假期的简单 HTML 表单。这是因为方法 HandleValidSubmit 是空的，我们还未调用任何 API 来获取假期数据。

在 Blazor Server 应用程序中使用 IHttpClientFactory 创建 HttpClient

在 Blazor Server 应用程序中使用 HttpClient 请求第三方 API 有多种不同的方式，让我们从一个基础的示例开始，在该示例中我们使用 IHttpClientFactory 创建 HttpClient 对象。

在项目中创建一个 Services 文件夹，并创建如下的 IHolidaysApiService 接口。该接口只有一个方法 GetHolidays，它以 HolidayRequestModel 作为参数并返回 HolidayResponseModel 对象的列表。

IHolidaysApiService.cs

public interface IHolidaysApiService { Task<List<HolidayResponseModel>> GetHolidays(HolidayRequestModel holidaysRequest); }

接下来，在 Services 文件夹中创建一个 HolidaysApiService 类，实现上面的接口。

HolidaysApiService.cs

public class HolidaysApiService : IHolidaysApiService { private readonly IHttpClientFactory _clientFactory; public HolidaysApiService(IHttpClientFactory clientFactory) { _clientFactory = clientFactory; } public async Task<List<HolidayResponseModel>> GetHolidays(HolidayRequestModel holidaysRequest) { var result = new List<HolidayResponseModel>(); var url = string.Format("https://date.nager.at/api/v2/PublicHolidays/{0}/{1}", holidaysRequest.Year, holidaysRequest.CountryCode); var request = new HttpRequestMessage(HttpMethod.Get, url); request.Headers.Add("Accept", "application/vnd.github.v3+json"); var client = _clientFactory.CreateClient(); var response = await client.SendAsync(request); if (response.IsSuccessStatusCode) { var stringResponse = await response.Content.ReadAsStringAsync(); result = JsonSerializer.Deserialize<List<HolidayResponseModel>>(stringResponse, new JsonSerializerOptions() { PropertyNamingPolicy = JsonNamingPolicy.CamelCase }); } else { result = Array.Empty<HolidayResponseModel>().ToList(); } return result; } }

在上面的 GetHolidays 方法中，我们首先为第三方 API 创建了一个 URL，并将国家代码和年份参数添加到 URL 中。

var url = string.Format("https://date.nager.at/api/v2/PublicHolidays/{0}/{1}", holidaysRequest.Year, holidaysRequest.CountryCode);

接下来，我们创建了 HttpRequestMessage 对象并配置它以向第三方 API URL 发送 HTTP GET 请求。

var request = new HttpRequestMessage(HttpMethod.Get, url); request.Headers.Add("Accept", "application/vnd.github.v3+json");

可以使用依赖注入 (DI) 请求一个 IHttpClientFactory，这正是我们将其注入到前面类的构造函数的原因。下面这行代码使用 IHttpClientFactory 创建了一个 HttpClient 实例。

var client = _clientFactory.CreateClient();

有了 HttpClient 对象之后，我们简单地调用它的 SendAsync 方法来发送一个 HTTP GET 请求。

var response = await client.SendAsync(request);

如果 API 调用成功，我们使用下面这行代码将其响应读取为字符串。

var stringResponse = await response.Content.ReadAsStringAsync();

最后，我们使用 JsonSerializer 类的 Deserialize 方法反序列化该响应。

result = JsonSerializer.Deserialize<List<HolidayResponseModel>>(stringResponse, new JsonSerializerOptions() { PropertyNamingPolicy = JsonNamingPolicy.CamelCase });

在测试该应用程序之前，我们需要在 Startup.cs 文件中注册 HolidaysApiService 服务。我们还需要调用 AddHttpClient 方法注册 IHttpClientFactory。