.Net 6 - 用于 blazor 的 UseCors

Posted 2023-03-31

【中文标题】.Net 6 - 用于 blazor 的 UseCors

【英文标题】：.Net 6 - UseCors for blazor

【发布时间】：2021-10-27 12:10:47

【问题描述】：

我正在尝试构建一个 blazor 应用程序，该应用程序需要从客户端获取一些 json，但是在我无法转换为 https 的 http 源上，当然我在 chrome 上遇到了 cors 问题。

      Unhandled exception rendering component: TypeError: Failed to fetch
System.Net.Http.HttpRequestException: TypeError: Failed to fetch
 ---> System.Runtime.InteropServices.javascript.JSException: TypeError: Failed to fetch
   at System.Net.Http.BrowserHttpHandler.SendAsync(HttpRequestMessage request, CancellationToken cancellationToken)
   --- End of inner exception stack trace ---
   at System.Net.Http.BrowserHttpHandler.SendAsync(HttpRequestMessage request, CancellationToken cancellationToken)
   at System.Net.Http.HttpClient.GetStringAsyncCore(HttpRequestMessage request, CancellationToken cancellationToken)
   at CncGenerator.MachineDashboard.MachineDashboardController.GetStatusAsync() in C:\Projects\CncGeneratorV4\CncGenerator\CncGenerator\MachineDashboard\MachineDashboardController.cs:line 26
   at CncGenerator.Shared.MachineDashboard.OnInitializedAsync() in c:\Projects\CncGeneratorV4\CncGenerator\CncGenerator\Shared\MachineDashboard.razor:line 24
   at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync()
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

所以我找到了一些解释如何通过添加来设置这些 Cors 的帖子

builder.Services.AddCors(options =>

    options.AddPolicy("CorsAllowAll",
        builder =>
        
            builder.AllowAnyMethod()
                .AllowAnyOrigin()
                .AllowAnyHeader()
                .SetIsOriginAllowed(origin => true)
                .WithMethods("GET, PATCH, DELETE, PUT, POST, OPTIONS");
        );
);

如果我理解正确，我应该这样做

var app = builder.Build();
app.UseCors("CorsAllowAll");
await app.RunAsync();

但我对使用 .net 6 的新方法有点迷茫，因为应用程序返回 WebAssemblyHost 而不是 IApplicationBuilder 如预期的那样能够使用扩展方法 UseCors。

我该如何解决？

问候，

【问题讨论】：

UseCors() 用于解决方案的服务器部分。那个“http 源”是你的代码吗？

"需要从客户端获取一些 json" 你的意思是从客户端发帖吗？正如@HenkHolterman 已经说过的，Cors 是在服务器端的 Program.cs 中设置的，用于您的 WebAPI 或您正在做的任何事情。您无需在客户端 Blazor 应用程序上设置 Cors。

是的，我需要对托管在我无法控制的服务中的 json 执行 GET，并且谁使用的是 HTTP 而不是 HTTPS。我如何对 chrome 说然后绕过他的默认证券？

【参考方案1】：

我需要对托管在我无法控制的服务中的 json 执行 GET

如果该服务器未配置为允许 CORS 请求，那么就使用 SPA 客户端而言，您就不走运了。

您可以从自己的服务器调用该服务。所以做一个直通端点。

我如何对 chrome 说然后绕过他的默认证券？

很多黑客也想知道这一点。

【讨论】：

为了给你更多的背景信息，我这里的项目只是控制一台 CNC 本地机器，不需要通过网络，但当然默认证券不是为那种场景制作的

没错。它不会改变答案。浏览器无法自行执行此操作。

那你如何解释我可以使用邮递员或提琴手向这个网址发出请求？ （对不起，我对这些主题有点新手）。顺便说一句，我还尝试在 http 中设置我的 blazor 应用程序来代替 https 来进行加密通信，但这并不是更好。当我使用 `return await Http.GetFromJsonAsync("192.168.1.11/rr_status?type=1")` 时，我在这里注意到了一件有趣的事情，他会自动尝试调用 https://192.168.1.11/rr_status?type =1（在代码中我使用http，但它在评论中消失了:-)）。

浏览器执行规则。 Postman 不在浏览器中运行。您可以添加 API 服务器（请参阅 Blazor Wasm + 托管模板），或使用 Blazor-ServerSide。 http/https 问题是单独的，我认为当您从服务器调用它时会解决。

好的，我已经完全重构了我的程序，让服务器端调用这个 API。而你在完全正确的地方使用这个逻辑。感谢您的建议！