当我尝试获取 API 端点时，为什么我的 ASP.NET Core Web API 会出现此错误？

Question

背景

我已经编写和运行 ASP.NET Core Web API 很长一段时间了，但突然当我尝试使用 fetch 检索简单端点（更多内容见下文）时，我收到以下错误：

VM22:1 拒绝连接到“http://localhost:5116/Weatherforecast”，因为它违反了以下内容安全策略指令：
“默认-src'无'”。请注意，“connect-src”未明确设置，因此“default-src”用作后备。

我以前从未见过这个。

重现步骤

您可以通过执行以下操作来生成非常基本的 ASP.NET Core 8 Web API：

$ dotnet core new webapi -o testApi

这将包括提供天气数据的端点。 您可以从网络浏览器对其执行 GET 操作，例如：

http://localhost:5116/weatherforecast

您会看到类似以下内容：

打开控制台/终端

但是，如果您打开浏览器控制台（大多数浏览器中为 F12）并尝试以下命令，那么您将收到我现在看到的错误：

   fetch ("http://localhost:5116/Weatherforecast")
      .then(response => response.json())
      .then(data => console.log(data));

我尝试过的

我询问了 Copilot，它告诉我将以下代码添加到我的

Program.cs

文件中：

app.Use(async (context, next) =>
{
    context.Response.Headers.Add("Content-Security-Policy", "default-src 'self';");
    await next();
});

但这并不能解决错误。

添加了 CORS 默认值

我还添加了以下代码：

builder.Services.AddCors(options => options.AddDefaultPolicy(builder =>
{
    builder.AllowAnyOrigin()
           .AllowAnyMethod()
           .AllowAnyHeader();
}));

app.UseCors();

什么可以解决这个问题？

我需要在 Web API 中设置什么才能再次进行这些获取调用？

Answer 1

您遇到的错误消息与内容安全策略 (CSP) 设置有关，这些设置很可能是在 API 的 HTTP 响应标头中配置的。 CSP 是一种安全措施，旨在通过定义浏览器可以加载哪些内容来防止各种攻击，例如跨站脚本 (XSS)。

要解决此问题，请考虑修改您的 CSP 标头。该错误表明 default-src 'none' 指令默认阻止任何资源加载，并且由于未指定 connect-src，因此它默认为一般策略。

您的跨源资源共享 (CORS) 设置似乎是正确的，应该允许来自任何来源的请求。为了确保其正确实现，请确保将 app.UseCors() 放置在 builder.Build() 调用之后、定义任何端点（如 app.MapControllers()）之前。中间件的顺序在 .NET Core 应用程序中至关重要。

验证提取请求中的 URL 是否与 API 中指定的端点路径的大小写匹配。 .NET Core 路由可能区分大小写，特别是在 Kestrel 等某些服务器上。

此外，请注意，浏览器可能会缓存 CSP 标头。清除浏览器缓存或尝试在私密浏览窗口中进行测试。