目录
[在 .NET Core 8 中设置 CORS](#在 .NET Core 8 中设置 CORS)
[高级 CORS 配置](#高级 CORS 配置)
如果您喜欢此文章，请收藏、点赞、评论，谢谢，祝您快乐每一天。
介绍
跨域资源共享 (CORS) 是 Web 浏览器中实现的一项安全功能，它限制网页向与自身域不同的域发出请求。在现代 Web 开发中，尤其是在使用 Angular 作为前端框架和 .NET Core 8 作为后端时，正确实现 CORS 对于构建安全且功能完善的应用程序至关重要。本文概述了在 .NET Core 8 环境中设置 CORS 的最佳实践和常见陷阱。
CORS
想象一下，你家里有个玩具箱（你的网站），你有个朋友住在隔壁（另一个网站）。你的朋友想玩你玩具箱里的玩具（数据），但你的妈妈（浏览器）规定，你的朋友只能玩自己的玩具。这是为了确保一切安全。
假设你的网站是 mycooltoys.com，你朋友的网站是 funfriend.com，如果 funfriend.com 想从 mycooltoys.com 借一个玩具，CORS 就会进行检查。
funfriend.com 可以从 mycooltoys.com 借用玩具吗？
他们是否遵循了提问的规则？
如果一切顺利，那么你的朋友就可以借用这个玩具了！
在 .NET Core 8 中设置 CORS
安装必要的软件包：如果您尚未安装，请确保已安装所需的 .NET Core 软件包。大多数情况下，默认设置即可满足需求，但您也可以根据需要安装任何特定的 CORS 库。
在启动时配置 CORS：在 .NET Core 8 中，CORS 的配置通常在 Program.cs 文件中完成。以下是一个简单的配置示例。
var builder = WebApplication.CreateBuilder(args);
// Add CORS services
builder.Services.AddCors(options =>
{
options.AddPolicy("AllowAngularApp",
builder => builder.WithOrigins("https://your-angular-app.com")
.AllowAnyMethod()
.AllowAnyHeader()
.AllowCredentials());
});
var app = builder.Build();
// Use CORS policy
app.UseCors("AllowAngularApp");
app.MapControllers();
app.Run();
**允许特定来源：**对于生产环境，务必指定确切的来源，而不是使用 AllowAnyOrigin()，后者是一个常见的陷阱。限制允许的来源可以增强安全性。
options.AddPolicy("AllowAngularApp",
builder => builder.WithOrigins("https://your-angular-app.com")
.AllowAnyMethod()
.AllowAnyHeader());
**处理预检请求：**确保您的服务器能够处理预检请求。这些是浏览器发送的用于检查权限的 OPTIONS 请求。通过启用 CORS 并处理这些请求，您可以确保您的应用程序能够正确响应。
**允许凭据：**如果您的 Angular 应用需要发送 cookie 或 HTTP 身份验证信息，则需要在 CORS 策略中设置 `AllowCredentials()`。请谨慎使用此功能，因为它要求显式指定来源，而不能设置为 `AllowAnyOrigin()`。
高级 CORS 配置
**自定义允许的方法：**如果您的 API 使用特定的 HTTP 方法，您可以自定义允许的方法。
options.AddPolicy("AllowAngularApp",
builder => builder.WithOrigins("https://your-angular-app.com")
.WithMethods("GET", "POST", "PUT", "DELETE")
.AllowAnyHeader()
.AllowCredentials());
**设置公开标头：**如果您的 API 返回客户端需要访问的自定义标头，请使用 WithExposedHeaders 指定这些标头。
options.AddPolicy("AllowAngularApp",
builder => builder.WithOrigins("https://your-angular-app.com")
.AllowAnyMethod()
.AllowAnyHeader()
.WithExposedHeaders("X-Custom-Header")
.AllowCredentials());
**记录 CORS 请求：**为了便于调试，您可以记录 CORS 请求以跟踪出现的任何问题。以下是一个简单的日志记录中间件。
app.Use(async (context, next) =>
{
if (context.Request.Headers.ContainsKey("Origin"))
{
var origin = context.Request.Headers["Origin"];
Console.WriteLine($"CORS request from: {origin}");
}
await next();
});
最佳实践
**限制来源：**务必指定允许与您的 API 交互的确切来源。避免使用通配符 (*)，因为它们会将您的 API 置于潜在的安全风险之中。
使用 HTTPS：确保您的 .NET Core 后端和 Angular 前端都通过 HTTPS 提供服务。这可以保护传输中的数据并增强可信度。
**定期审查 CORS 策略：**随着应用程序的增长和发展，请定期审查 CORS 配置，以确保其符合当前的安全要求。
**测试 CORS 配置：**使用 Postman 或浏览器开发者工具等工具测试您的 CORS 设置。检查错误并确保您的 API 返回预期的标头。
**API 文档：**在 API 文档中清晰地记录 CORS 策略和允许的来源。这有助于其他开发者了解如何正确地与您的 API 交互。
常见陷阱
**允许来源配置错误：**最常见的错误之一是允许来源配置错误。请仔细检查确切的 URL，包括协议（HTTP 或 HTTPS）以及任何可能的尾部斜杠。
**忘记应用 CORS 中间件：**请确保在映射任何端点之前应用 UseCors 中间件。将其放在端点映射之后可能会导致意外行为。
**AllowAnyOrigin 与 AllowCredentials 结合使用：**此组合不被允许，会导致 CORS 请求失败。如果需要凭据，请指定确切的来源。
**未处理 OPTIONS 请求：**忽略预检 OPTIONS 请求可能会导致 API 从不同来源访问时出现问题。请确保您的服务器能够正确处理这些请求。
例子
默认
允许特定来源
结论
在 .NET Core 8 中为 Angular 应用程序实现 CORS 对于创建安全且功能完善的 Web 应用程序至关重要。遵循最佳实践并注意常见陷阱，可以确保 CORS 配置既有效又安全。随着应用程序的演进，定期检查 CORS 配置有助于长期维护其安全性和功能性。
如果您喜欢此文章，请收藏、点赞、评论，谢谢，祝您快乐每一天。