Windows Forms BlazorWebView中JavaScript fetch请求HTTP API失败求助

问题根源 #

Windows Forms的BlazorWebView基于WebView2控件，默认启用了浏览器的混合内容阻止策略：当BlazorWebView以HTTPS协议加载本地内容（默认是https://localhost:{端口}）时，会禁止JavaScript向HTTP协议的外部API发起请求。这就是为什么HTTPS API能正常调用、HTTP API连请求都发不出去的原因——而Blazor的HttpClient是.NET端请求，不受浏览器JS安全规则限制，所以可以正常工作。

解决方案 #

方案1：允许WebView2加载混合内容

在窗体的加载事件中，修改WebView2的设置，允许混合内容：

private async void Form1_Load(object sender, EventArgs e)
{
    await blazorWebView1.EnsureCoreWebView2Async();
    // 开启混合内容允许开关
    blazorWebView1.CoreWebView2.Settings.IsMixedContentAllowed = true;
}

方案2：将目标API切换为HTTPS协议

这是最合规的长期方案，直接把后端API服务配置为HTTPS，从根源上避免混合内容问题，也符合现代Web安全规范。

方案3：修改BlazorWebView本地加载协议为HTTP

如果不想调整API或WebView2安全设置，可以将BlazorWebView的本地服务协议改成HTTP，这样发起HTTP请求就不再属于混合内容：

// 在Program.cs中修改WebHost配置
var builder = WebApplication.CreateBuilder();
builder.Services.AddBlazorWebView();

// 指定本地服务使用HTTP协议
builder.WebHost.UseUrls("http://localhost:5000");

var app = builder.Build();
// 其他中间件配置...
app.Run();

验证 #

完成任意一种配置后，重新运行Windows Forms项目，通过IJSRuntime调用JS的fetch方法即可正常发起HTTP API请求。

内容的提问来源于stack exchange，提问作者rdevilliers