背景
最近笔者在开发一个基于 ASP.NET Web API 的前端项目时，遇到了跨域问题。每次向后端发送 HTTP 请求时，浏览器都会报错提示跨域。经查询发现，这是因为浏览器的同源策略导致的。同源策略是一种浏览器安全机制，会防止一个站点的 JavaScript 脚本访问另一个站点的内容。但在某些场景下，我们需要跨域访问资源。
什么是 CORS
CORS（Cross-Origin Resource Sharing）是一种机制，用于允许 Web 应用程序访问不属于其来源的资源。简单来说，CORS 允许在一个域名下的网页向另一个域名的服务器发起 XMLHttpRequest 请求。CORS 的实现是通过在 HTTP 头部添加一些标识的字段来告诉浏览器服务器是否允许跨域请求。
ASP.NET Web API 中的 CORS 问题
ASP.NET Web API 是一种 Microsoft 的框架技术，用于构建 RESTful Web 服务。在 Web API 中，如果我们不做任何配置，跨域请求将被默认禁止。为了解决这个问题，我们需要在 Web API 项目中进行一些配置。
解决方案
方法一：使用 EnableCorsAttribute 属性
ASP.NET Web API 中提供了一个 EnableCorsAttribute 属性，可以用来处理跨域情况。我们只需要在需要支持跨域的 Controller 或方法上打上 EnableCorsAttribute 标签，然后指定允许跨域的来源源（origin）、请求方法（methods）和请求头（headers）即可。例如，以下代码为指定访问来源任意、请求方法为 GET 和 POST，允许自定义请求头。
[EnableCors(origins: "*", methods: "GET,POST", headers: "*")]
public class YourController : ApiController {
// ...
}方法二：修改 Web.config 文件
如果我们需要为多个 Controller 配置跨域，可以在 Web.config 文件中设置全局配置，而不必在每个 Controller 上添加 EnableCorsAttribute 标签。以下代码为配置允许来自任意来源的所有请求。
-- -------------------- ---- -------
------------------
--------------
---------------
---- ---------------------------------- --------- --
---- --------------------------------------- ------------ --
---- ----------------------------------- ----------- ----- ---- ------- -------- --
---- ----------------------------------- -------------- ----------------- ------------- --
----------------
---------------
-------------------示例代码
以下是一个示例代码，展示如何在 ASP.NET Web API 应用程序中实现跨域请求：
-- -------------------- ---- -------
----- ----------------
----- ----------------
----- ---------------------
--------- ------------------
-
-------------------- ---- -------- ---- -------- -----
------ ----- ---------------- - -------------
-
-- --- ----------
------ ----------------- -----
-
------ ------ -------- - --------- -------- ---
-
-- ---- ----------
------ ----------------- --------------------- ------
-
------ -----
-
-
-总结
跨域问题是 Web 开发中经常会遇到的问题之一，它在一定程度上影响了 Web 应用程序的可靠性和灵活性。本文介绍了如何解决 ASP.NET Web API 中的跨域问题，希望可以帮助到有需要的读者。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/651a76a795b1f8cacd263eba