跨域资源共享（CORS）是指在客户端通过 JavaScript 向不同域名的服务器请求资源时产生的安全机制。由于浏览器存在同源策略，以往只能通过代理接口的方式支持跨域请求，而 CORS 机制通过添加一些 HTTP 头信息，让服务器能够和浏览器协商，并决定是否允许跨域请求。
对于 Fastify 应用开发者而言，要正确、安全地处理 CORS 实现跨域请求，本文将介绍如何配置 Fastify-CORS 插件并提供详细的学习和指导意义。
使用 Fastify-CORS 插件
Fastify-CORS 是 Fastify 生态圈中一款专门用于处理跨域资源共享的插件。该插件使用领先的 CORS 库，提供了一个简单的 API 来设置跨域请求的选项。Fastify-CORS 插件支持灵活的配置选项，包括允许所有源请求、允许多个域名请求、允许带凭证的请求等。
安装 Fastify-CORS 插件
安装 Fastify-CORS 插件很简单，只需要使用 npm 指令即可：
npm install fastify-cors --save
配置 Fastify-CORS 插件
借助 Fastify-CORS 插件，Fastify 应用只需一步就可以快速配置支持跨域请求。定义以下路由代码：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- ---- - ------------------------ ----- --- - ---------- ------------------ - ------- ----- --- ------------ ----- ----- ---- -- - ------ - -------- ------ --------- -- --- ----- ----- - ----- -- -- - --- - ----- ----------------- -------------------- --------- -- ------------------------------- - ----- ----- - ------------------- ---------------- - -- --------展开代码
在注册 Fastify-CORS 插件时，指定 origin 选项的值为 true，表示接受来自所有源的请求。如果你只允许指定的域名发起请求，可以在 origin 中设置对应的域名或允许的域名数组。
这是基本配置案例，可以在此基础上进行进一步的配置以满足不同的业务需求：
-- -------------------- ---- ------- ------------------ - ------- ---------------------- ------------------------ -------- ------- ------- ------ ---------- --------------- ---------------- ----------------- ------------ ----- ------- ------ ------------------ ------ --------------------- --- ---展开代码
让我们看看每个选项的含义：
origin：允许的请求源，可以是字符串、正则表达式或数组。methods：允许使用的 HTTP 方法，例如 GET、POST 等。allowedHeaders：允许客户端发送的请求头列表。credentials：指示是否允许发送带凭据的请求（例如 cookies、授权头等）。maxAge：指定 preflight 请求的最大时间，单位为秒。preflightContinue：是否继续处理 preflight 请求。optionsSuccessStatus：定义返回的状态码，默认为 204。
示例代码
在 Fastify 应用中使用 Fastify-CORS 插件，以下是一个基本的示例代码。
-- -------------------- ---- ------- ----- ------- - ------------------- ----- ---- - ------------------------ ----- --- - ---------- ------------------ - ------- ------------------------- ------------------------ ------------------------ ------------------------- -------- ------- ------- ------ ---------- --------------- ---------------- ----------------- ------------ ----- ------- ------ ------------------ ------ --------------------- --- --- ------------ ----- ----- ---- -- - ------ - ------ ------- -- --- -----------------展开代码
上述示例代码中，Fastify 应用将会允许来自以下域名的请求：
允许的 HTTP 方法包括 GET、POST、PUT 和 DELETE。同时，应用将在使用预检查缓存时等待 86400 秒。使用用户凭据处理跨域请求，并支持头信息 Authorization、Content-Type。最后，Fastify-CORS 插件会返回 204 状态码，表示请求正常处理，没有内容需要返回。
总结
Fastify-CORS 插件使 Fastify 应用程序处理跨域资源共享时变得更加简单。使用该插件时，可以根据实际情况灵活配置选项，以更好地支持业务需求。若你需要管理跨域资源共享，建议使用 Fastify-CORS 插件来保证应用程序的高效性及安全性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64eef1b9f6b2d6eab38f0e4c
