什么是 CORS
CORS（Cross-Origin Resource Sharing）是一种机制，它可以让 Web 应用程序从不同的源访问其资源。在 Web 应用程序中，如果 JavaScript 代码在浏览器中通过 XMLHttpRequest 或 Fetch API 向不同的域名（协议、端口号不同也算）发起请求，这种行为就叫做跨域请求。
跨域请求会受到浏览器的安全限制，如果没有特殊的设置，这类请求的响应将被浏览器拦截。因此，CORS 机制就应运而生，它通过在请求和响应中添加特定的 HTTP 头信息，告诉浏览器该请求是被允许的，从而解决了跨域请求的问题。
Koa2 是一种基于 Node.js 平台的 Web 开发框架，它的灵活性和可扩展性使得它成为了越来越多前端开发者的选择。在 Koa2 中集成 CORS 解决方案，可以让我们方便地处理跨域请求，并且提高开发效率。
安装 koa2-cors 中间件
要在 Koa2 中使用 CORS 解决方案，我们需要使用 koa2-cors 中间件。首先，我们需要安装该中间件：
npm install koa2-cors --save
在 Koa2 应用中使用 koa2-cors 中间件
在安装了 koa2-cors 中间件之后，我们需要在 Koa2 应用中使用它。在 Koa2 应用中使用 koa2-cors 中间件的方法如下：
const Koa = require('koa');
const cors = require('koa2-cors');
const app = new Koa();
app.use(cors());
app.listen(3000);在上述代码中，我们首先引入了 koa2-cors 中间件，然后在 Koa2 应用中使用它。在使用中间件时，我们需要调用 app.use() 方法，并将中间件作为参数传入。这样，在我们的 Koa2 应用中就可以使用 CORS 解决方案了。
配置 koa2-cors 中间件
除了在 Koa2 应用中使用 koa2-cors 中间件之外，我们还可以对该中间件进行配置，以满足我们的需求。在 koa2-cors 中间件中，我们可以配置以下选项：
- origin：表示允许跨域请求的源，可以是一个字符串、一个正则表达式、一个函数或一个布尔值。默认值为
*，表示允许所有源。 - exposeHeaders：表示允许客户端访问的响应头，可以是一个字符串数组。默认值为空数组。
- maxAge：表示允许客户端缓存预检请求的时间（以秒为单位）。默认值为
86400。 - credentials：表示是否允许客户端发送 Cookie 和认证信息。默认值为
false。 - allowMethods：表示允许客户端发送的 HTTP 方法，可以是一个字符串、一个字符串数组或一个正则表达式。默认值为
GET,HEAD,PUT,POST,DELETE,PATCH。 - allowHeaders：表示允许客户端发送的请求头，可以是一个字符串、一个字符串数组或一个正则表达式。默认值为空数组。
我们可以在使用 koa2-cors 中间件时，将上述选项作为参数传入，以进行配置。例如：
app.use(cors({
origin: 'http://localhost:8080',
exposeHeaders: ['Content-Length', 'Authorization'],
maxAge: 86400,
credentials: true,
allowMethods: ['GET', 'POST', 'PUT', 'DELETE'],
allowHeaders: ['Content-Type', 'Authorization', 'Accept'],
}));在上述代码中，我们将 origin 设置为 http://localhost:8080，表示只允许该源发起跨域请求。我们还将 exposeHeaders 设置为 ['Content-Length', 'Authorization']，表示允许客户端访问响应头 Content-Length 和 Authorization。此外，我们还将 credentials 设置为 true，表示允许客户端发送 Cookie 和认证信息。
示例代码
下面是一个完整的示例代码，展示了如何在 Koa2 应用中使用 koa2-cors 中间件。
-- -------------------- ---- -------
----- --- - ---------------
----- ---- - ---------------------
----- --- - --- ------
--------------
------- ------------------------
-------------- ------------------ -----------------
------- ------
------------ -----
------------- ------- ------- ------ ----------
------------- ---------------- ---------------- ----------
----
------------- ----- ----- -- -
-- ----------- --- ------ -
-------- - ------- --------
- ---- -- ----------- --- ------- -
-------- - - -------- --------- ---- -------- --
-
---
-----------------在上述代码中，我们首先引入了 koa2-cors 中间件，然后在 Koa2 应用中使用它，并进行了一些配置。接着，我们定义了一个路由处理函数，根据请求方法返回不同的响应。最后，我们监听了端口号 3000，启动了我们的 Koa2 应用。
总结
在本文中，我们介绍了 CORS（Cross-Origin Resource Sharing）机制，它可以让 Web 应用程序从不同的源访问其资源。我们还介绍了如何在 Koa2 中集成 CORS 解决方案，使用 koa2-cors 中间件来处理跨域请求。最后，我们还展示了一个完整的示例代码，帮助读者更好地理解如何使用 koa2-cors 中间件。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/663278dad3423812e400e70b