Blazor 请求被 CORS 策略阻止答案

【问题标题】：Blazor Request blocked by CORS policyBlazor 请求被 CORS 策略阻止
【发布时间】：2019-11-30 02:51:19
【问题描述】：

我正在尝试从 Blazor(client-side) 客户端向服务器发送请求，但我不断收到此错误：

从“[route]”（重定向自“[other route]”）处获取的访问权限原点“[原点路由]”已被 CORS 策略阻止：否请求中存在“Access-Control-Allow-Origin”标头资源。如果不透明的响应满足您的需求，请设置请求的模式为“no-cors”以获取禁用 CORS 的资源。

在服务器上，我已经在管道中添加了CORS 扩展，但无济于事：

服务器启动

public void ConfigureServices(IServiceCollection services) {
            services.AddCors();
            services.AddResponseCompression(options => {
                options.MimeTypes = ResponseCompressionDefaults.MimeTypes.Concat(new[]
                {
                    MediaTypeNames.Application.Octet,
                    WasmMediaTypeNames.Application.Wasm,
                });
            });
}
 public void Configure(IApplicationBuilder app, IHostingEnvironment env) {

            app.UseCors(x => x.AllowAnyHeader().AllowAnyMethod().AllowAnyOrigin().AllowCredentials());

            app.UseResponseCompression();

            app.UseMvc();

            app.UseBlazor<Client.Startup>();

        }

Blazor 客户端请求

public async Task<Catalog> GetCatalogAsync() {
            try {
                HttpRequestMessage message = new HttpRequestMessage {
                    RequestUri = new Uri(BASE_PATH + Routes.GET_CATALOG), //BASE_PATH= 172.XX.XX.XX:8600
                    Method = HttpMethod.Get
                };
                var resp = await this.client.SendAsync(message); // client is HttpClient
                var resultString = await resp.Content.ReadAsStringAsync();
                var result = JsonConvert.DeserializeObject<Catalog>(resultString);
                return data;

            } catch (Exception ex) {

                throw;
            }

        }

控制器

[HttpGet]
[Route(Routes.GET_CATALOG)]
public async Task<Catalog> GetCatalogAsync() {
    try {
        var registry = await this.adminService.GetCatalogAsync();
        return registry;
    } catch (Exception ex) {

        throw;
    }
}

POCO

[Serializeable]
public struct Catalog{
}

我还能做些什么才能访问我的服务器？是因为 Blazor 吗？如您所见，我已经添加了UseCors(...)。

附注
我已经发布了我的 Blazor Server 项目和客户端。它们在同一个目录中。我将这个文件夹放在计算机上，我正在尝试从我的计算机打开 blazor：172.168.18.22:8600/

更新
我也尝试将标题添加到我的HttpRequestMessage 无济于事：

HttpRequestMessage message = new HttpRequestMessage {
                    RequestUri = new Uri(BASE_PATH + Routes.GET_CATALOG),
                    Method = HttpMethod.Get,

                };
message.Headers.Add("Access-Control-Allow-Origin","*");
message.Headers.Add("Access-Control-Allow-Credentials", "true");
message.Headers.Add("Access-Control-Allow-Headers", "Access-Control-Allow-Origin,Content-Type");

【问题讨论】：

您的客户端 Blazor 是否与服务器共享同一个域？
您从 Blazor 向哪个地址发出请求？您的 Blazor 应用程序位于哪个地址？
他们确实共享同一个域。
如果是这样，问题不在于 CORS。这是一个用户代码问题。

标签： .net-core cors blazor

【解决方案1】：

@Bercovici Adrian，您为什么要在您的应用程序中添加 CORS 支持？您是否提出跨源请求？如果不这样做，请不要尝试通过添加可能导致更细微错误的不必要配置来解决问题。

像往常一样，没有看到这个应用程序的回购，不能再帮助你了。

更新：

这是什么UseBlazor？

您应该将您的应用升级到最新版本...

新更新：

抱歉，我使用的是 Blazor 的当前预览版

启动类

 public class Startup
{
    public Startup(IConfiguration configuration)
    {
        Configuration = configuration;
    }

    public IConfiguration Configuration { get; }

    // This method gets called by the runtime. Use this method to add services to the container.
    // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
    public void ConfigureServices(IServiceCollection services)
    {
        services.AddMvc().AddNewtonsoftJson();
        services.AddResponseCompression(opts =>
        {
            opts.MimeTypes = ResponseCompressionDefaults.MimeTypes.Concat(
                new[] { "application/octet-stream" });
        });

    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        app.UseResponseCompression();

        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
            app.UseBlazorDebugging();
        }
        **// Instead of UseBlazor**
        app.UseClientSideBlazorFiles<Client.Startup>();
        app.UseStaticFiles();

        app.UseRouting();

        **// This configure your end points**
        app.UseEndpoints(endpoints =>
        {
            endpoints.MapDefaultControllerRoute();
            endpoints.MapFallbackToClientSideBlazor<Client.Startup>("index.html");
        });
    }
}

请注意，我已删除 CORS 的配置，因为您的客户端和服务器共享同一个域。请使用文档如何正确配置 CORS。

试试这个，看看它是否适合你（我猜你的问题与端点的配置有关。不知何故，在我看来，因为你没有配置端点，你的请求被重定向，因此你得到你上面显示的消息。）

接下来要做的是检查您的 http 请求是否正确处理。但首先要检查端点。

【讨论】：

我在服务器项目中使用.NET Core 2.1
你为什么不升级？？？显示您发出的 http 请求的代码...显示您的 Web Api...显示启动代码...帮助我们为您提供帮助。
在我的回答中查看新更新部分
我想我没有理解关于域的问题。调用客户端的位置不会在部署应用程序的计算机上。

【解决方案2】：

检查您在从 HTTPS 运行时不发送 HTTP 请求。例如，如果您在 https://172.168.18.22:8600 打开应用程序时向 http://172.168.18.22:8600 发送请求，您可能会遇到问题。

【讨论】：

我已经检查过我是从 http 运行的。
抱歉，我还是问你，你肯定不会向 HTTP 和完全相同的端口发出请求？
我正在向完全相同的端口发出请求，并且请求是 http 而不是 https。所以我的服务器托管在：172.22.XX.YY:8600 并且我向该地址发出请求。
你能不能打开 Chrome Web 控制台，并尝试使用 fetch 发出相同的请求。客户端 Blazor 只是在后台调用 fetch，所以这将是公平的故障排除。
我得到同样的错误，它没有任何意义。当然，客户端/服务器架构的全部意义在于客户端和服务器可以位于不同的位置。

【解决方案3】：

不知何故，问题是由于缓存在浏览器上的非常旧的客户端版本造成的。在此问题之后，我再也不会忘记清除浏览器缓存。谢谢大家的帮助和支持！

【讨论】：