Blazor 使用 HttpClient 调用 Web API 教程

幻夢星雲

发布时间：2025-12-31 10:54:02

731人浏览过

来源于php中文网

原创

Blazor中调用Web API需正确配置HttpClient服务、处理跨域、管理生命周期及错误；推荐使用命名或类型化客户端，通过IHttpClientFactory注入，结合GetFromJsonAsync/PostAsJsonAsync发送请求，并确保后端启用CORS。

blazor 使用 httpclient 调用 web api 教程

Blazor 中使用 HttpClient 调用 Web API 是最常用的数据交互方式，关键在于正确配置服务、处理跨域、管理生命周期，并做好错误应对。

注册并注入 HttpClient 服务

Blazor WebAssembly 和 Blazor Server 的注册方式略有不同，但都推荐使用命名客户端（Named Client）或类型化客户端（Typed Client）来提升可维护性。

在 Program.cs（.NET 6+）中注册命名客户端：

builder.Services.AddHttpClient("MyApi", client =>
{
    client.BaseAddress = new Uri("https://api.example.com/");
    client.DefaultRequestHeaders.Accept.Add(
        new MediaTypeWithQualityHeaderValue("application/json"));
});

在组件中通过 [Inject] 获取：

@inject IHttpClientFactory HttpClientFactory

@code {
    private HttpClient _httpClient;
    protected override void OnInitialized()
    {
        _httpClient = HttpClientFactory.CreateClient("MyApi");
    }
}

更推荐直接注入 IHttpClientFactory 而非 HttpClient 实例，避免 DNS 变更或连接泄漏问题。

发送 GET 请求并解析 JSON

调用 REST API 获取数据时，通常用 GetFromJsonAsync() 方法，它自动反序列化响应体。

定义对应的数据模型（如 WeatherForecast.cs）
在组件中发起请求：

private List forecasts = new();
private bool isLoading = true;

protected override async Task OnInitializedAsync()
{
    try
    {
        forecasts = await _httpClient.GetFromJsonAsync>("weatherforecast");
    }
    catch (HttpRequestException ex)
    {
        // 处理 4xx/5xx 响应
        Console.WriteLine($"请求失败：{ex.Message}");
    }
    finally
    {
        isLoading = false;
    }
}

注意：确保 API 返回的 JSON 结构与 C# 类型完全匹配（字段名大小写、嵌套结构等），否则反序列化会静默失败或为 null。

绘蛙AI修图

绘蛙平台AI修图工具，支持手脚修复、商品重绘、AI扩图、AI换色

下载

处理 POST 请求与表单提交

向 API 提交数据常用 PostAsJsonAsync()，它自动设置 Content-Type: application/json 并序列化对象。

构造请求数据对象（如 NewTodo）
调用方法并检查响应状态码：

var newTodo = new NewTodo { Title = "买牛奶", IsCompleted = false };
var response = await _httpClient.PostAsJsonAsync("todos", newTodo);

if (response.IsSuccessStatusCode)
{
    var createdTodo = await response.Content.ReadFromJsonAsync();
    todos.Add(createdTodo);
}
else
{
    var error = await response.Content.ReadAsStringAsync();
    Console.WriteLine($"创建失败：{error}");
}

若需上传文件或混合表单数据，改用 MultipartFormDataContent 手动构建请求体。

跨域（CORS）与本地开发注意事项

Blazor WebAssembly 运行在浏览器沙箱中，受同源策略限制。调用非同源 API 必须由后端启用 CORS。

.NET Web API 示例（Program.cs）：

builder.Services.AddCors(options =>
{
    options.AddPolicy("AllowBlazorApp", policy =>
    {
        policy.WithOrigins("https://localhost:5001") // Blazor WASM 默认地址
            .AllowAnyMethod()
            .AllowAnyHeader();
    });// ...
app.UseCors("AllowBlazorApp");

开发阶段也可用代理（如 dev-server proxy 或 ASP.NET Core 代理中间件）绕过浏览器 CORS 检查
Blazor Server 不受浏览器 CORS 限制（请求由服务器发出），但仍需注意后端网络可达性

基本上就这些 —— 配置好客户端、选对方法、处理好异常和跨域，调用 Web API 就很稳了。

Blazor C# 调用 JS 的详细方法 (JS Interop)

Blazor 怎么集成图表库 (Chart.js)

Blazor 调用 JS confirm 实现删除确认的方法

Blazor 怎么调用 JavaScript 函数

Avalonia如何实现一个Webview控件 Avalonia集成浏览器内核

相关标签:

js json 浏览器 app 后端 ai dns nas 跨域 rest api 状态码 c# 表单提交 .net 中间件 json NULL 对象

本站声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

上一篇：c#和python哪个好学 c#和python怎么选下一篇：c# gRPC 和 Web API 在高并发场景下的性能对比

作者最新文章

网易云音乐网页版在线播放官方授权登录入口

2025-12-27 13:17

MAUI怎么传递参数到新页面 MAUI导航传参步骤

2025-12-27 13:21

c# list 去重的方法

2025-12-27 13:43

360云盘网页版快速入口官方账号登录入口

2025-12-27 14:00

Dapper如何映射到嵌套的复杂类型 Dapper深层对象映射

2025-12-27 14:33

网页视频无法播放怎么办，显示加载失败或黑屏的修复技巧

2025-12-27 14:56

美柚怎么设置密码锁美柚开启隐私密码保护教程

2025-12-27 15:13

Avalonia怎么使用AutoCompleteBox控件 Avalonia自动完成输入框

2025-12-27 15:14

百度AI助手官方入口文心一言网页版登录入口

2025-12-27 15:21

绿色版IE浏览器入口免安装IE浏览器网页入口

2025-12-27 20:21

热门AI工具

DeepSeek

幻方量化公司旗下的开源大模型平台

AI大模型

开放平台

豆包大模型

字节跳动自主研发的一系列大型语言模型

AI大模型

通义千问

阿里巴巴推出的全能AI助手

AI大模型

腾讯元宝

腾讯混元平台推出的AI助手

文档处理

Excel 表格

文心一言

文心一言是百度开发的AI聊天机器人，通过对话可以生成各种形式的内容。

AI大模型

中文写作

讯飞写作

基于讯飞星火大模型的AI写作工具，可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

中文写作

写作工具

即梦AI

一站式AI创作平台，免费AI图片和视频生成。

图片拼接

图画生成

ChatGPT

最最强大的AI聊天机器人程序，ChatGPT不单是聊天机器人，还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

AI大模型

中文写作

智谱清言 - 免费全能的AI助手

AI大模型

PDF 文档

相关专题

什么是中间件

中间件是一种软件组件，充当不兼容组件之间的桥梁，提供额外服务，例如集成异构系统、提供常用服务、提高应用程序性能，以及简化应用程序开发。想了解更多中间件的相关内容，可以阅读本专题下面的文章。

175

2024.05.11

Golang 中间件开发与微服务架构

本专题系统讲解 Golang 在微服务架构中的中间件开发，包括日志处理、限流与熔断、认证与授权、服务监控、API 网关设计等常见中间件功能的实现。通过实战项目，帮助开发者理解如何使用 Go 编写高效、可扩展的中间件组件，并在微服务环境中进行灵活部署与管理。

212

2025.12.18

json数据格式

JSON是一种轻量级的数据交换格式。本专题为大家带来json数据格式相关文章，帮助大家解决问题。

402

2023.08.07

json是什么

JSON是一种轻量级的数据交换格式，具有简洁、易读、跨平台和语言的特点，JSON数据是通过键值对的方式进行组织，其中键是字符串，值可以是字符串、数值、布尔值、数组、对象或者null，在Web开发、数据交换和配置文件等方面得到广泛应用。本专题为大家提供json相关的文章、下载、课程内容，供大家免费下载体验。

528

2023.08.23