什么是 cors？
CORS (Cross-Origin Resource Sharing) 是一种 Web 应用程序的安全机制，它允许浏览器在一个网页中发送 AJAX 请求，且该请求链接不属于该网页所在的域名下。简单来说，CORS 是一种解决浏览器跨域限制的方式。
Fastify 的 cors 支持
由于 Fastify 是一个专注于性能、低开销的 Web 框架，它的核心不包含 CORS 实现。但 Fastify 为开发者提供了良好的扩展性，可以很容易的实现 CORS 功能。
Fastify 默认安装了 fastify-cors 插件，它提供了使用 Fastify 加载 CORS 的支持。在使用 fastify-cors 时，我们可以通过简单的配置即可启用跨域支持。
安装 fastify-cors
使用 npm 安装 fastify-cors 插件：
npm i fastify-cors --save
启用 cors
在 Fastify 应用中手动注册 cors 插件：
-- -------------------- ---- ------- ----- ------- - -------------------- ----------------------------------------- - ------- ---- -- -------------------- ----- -- - -- ----- - ---------------------- --------------- - ------------------------ --------- -- ---------------------------------- --展开代码
现在，Fastify 应用支持 CORS。
参数说明：
| 参数 | 描述 | 默认值 |
|---|---|---|
| origin | 允许跨域的 Origin，可以是通配符 | * |
| methods | 允许的 HTTP 请求方法列表，可以是数组 | GET,PUT,POST,DELETE |
为了提高安全性，建议将 origin 属性设置为一个明确的域名或者 false。
自定义 cors 配置
fastify-cors 插件支持完全控制 CORS 配置。以下是自定义配置的示例：
fastify.register(require('fastify-cors'), { origin: ['https://localhost:3000'], methods: ['GET', 'PUT', 'DELETE'], optionsSuccessStatus: 204, preflightContinue: false, credentials: true })
参数说明：
| 参数 | 描述 | 默认值 |
|---|---|---|
| origin | 允许跨域的 Origin，可以是数组 | * |
| methods | 允许的 HTTP 请求方法列表，可以是数组 | GET,PUT,POST,DELETE |
| optionsSuccessStatus | 预检请求成功的 HTTP 状态码，可以是数字 | 204 |
| preflightContinue | 是否继续预检请求处理 | false |
| credentials | 是否允许发送 Cookie 和授权头 | true |
| exposedHeaders | 允许的响应头列表，数组 | - |
| allowedHeaders | 允许的请求头列表，数组 | - |
| maxAge | 预请求可缓存的秒数 | 86400 |
| originFunctionsOrAsync | 获得响应头的asynchronous函数的列表。 | null |
cors 和安全
CORS 的一个基本原则是，浏览器发出的跨站点请求只应包含对不依赖于任何 cookie 或在某些情况下应该跨站点的带有首部信息的 GET 请求。 否则，请求必须附带相应的 CORS 安全首部。注意由于安全限制, 如果您想使用凭据, 您不能使用通配符了.
以下是使用 cors 时存在的一些安全问题:
- 不允许使用通配符
通配符允许任何域都能请求你的 API。如果你的 API 发送了任何敏感信息或可能会导致意外或意外破坏的数据，请确保不允许使用通配符。
- 坚持使用 https
跨域请求通常会泄漏一些敏感信息，例如 cookie 和授权标头等。如果您不是使用 https 发送请求，很容易从请求/响应中获取这些值。请确保始终使用 https。
结语
在使用 Fastify 编写 Web API 时，很可能需要使用到跨域支持。fastify-cors 插件提供了一种简单的方式来处理 CORS，使开发人员能够专注于业务逻辑而不必担心浏览器的跨域限制 ; 。本文介绍了如何在 Fastify 中启用 CORS，并提供了自定义 CORS 配置的示例，同时也强调了安全性方面的问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67d6b958a941bf7134c9418e
