跨域资源共享 (CORS) 是一种 Web 应用程序安全机制，用于使一个域上的资源可以被另一个域访问。在 Fastify 框架中，我们可以通过设置特定的响应头来控制 CORS 行为。在这篇文章中，我们将深入探讨如何在 Fastify 应用程序中设置 CORS ，并提供一些示例代码。
设置 CORS
在 Fastify 应用程序中设置 CORS 非常简单。我们只需要使用 fastify-cors 插件，并在应用程序中注册它。首先，我们需要安装插件：
npm install fastify-cors
现在，我们可以在应用程序中启用插件，并设置一些选项。这里，我们可以定制一些基本选项，如哪些来源、允许的方法和允许的头。我们还可以设置一些常见选项，如暴露 X-Requested-With 头和处理凭证。
const fastify = require('fastify')(); const cors = require('fastify-cors'); fastify.register(cors, { origin: '*', methods: 'GET,PUT,POST,DELETE', allowedHeaders: 'Content-Type,Authorization' });
以上代码将允许任何来源访问该应用程序，并且仅允许使用的 HTTP 请求方法为 GET、PUT、POST 或 DELETE。此外，只有 Content-Type 和 Authorization 请求头被允许，而其他头将被拒绝。默认情况下，所有响应将暴露出 X-Requested-With 头，并且不会处理凭证。
更多选项
除了上面提到的选项之外，我们还可以定制其他选项以满足特定需求。
maxAge
maxAge 选项指定在一个简单请求完成之前，上面设置的 CORS 规则要被缓存多长时间。这可以节省跨域请求中的预检测请求（OPTIONS 请求）的数量。该值是一个以秒为单位的数字。
fastify.register(cors, { maxAge: 7200 });
以上代码将在两小时内缓存 CORS 规则。
optionsSuccessStatus
optionsSuccessStatus 选项指定响应预检请求的 HTTP 状态码。默认情况下，这是 204（无内容）。但是，我们可以使用这个选项定制预请求的响应代码，以返回适合您的应用程序逻辑的 HTTP 状态码。
fastify.register(cors, { optionsSuccessStatus: 200 });
以上代码将设置预检查请求的响应状态代码为 200。
preflight
preflight 选项允许您控制是否启用预检查功能。如果您的应用程序中不需要预检查，那么将该选项设置为 false 能够提高性能。
fastify.register(cors, { preflight: false });
以上代码将禁用预检查功能。
示例代码
这里是一个完整的 Fastify 应用程序示例，其中包括有助于理解 CORS 的示例代码。
-- -------------------- ---- ------- ----- ------- - --------------------- ----- ---- - ------------------------ ---------------------- - ------- ---- -------- ---------------------- --------------- ----------------------------- ------- ----- --------------------- ---- ---------- ----- --- ---------------- ----- --------- ------ -- - ------ - ------ ------- -- --- -------------------- ----- -------- -- - -- ----- - ------------------- ---------------- - ------------------- --------- -- ------------- ---展开代码
以上代码将启用 CORS ，并监听 3000 端口。当您尝试访问该应用程序时，您将看到如下输出：
Server listening on http://127.0.0.1:3000
您可以使用任何 HTTP 客户端来访问应用程序的根路径，例如：
curl http://127.0.0.1:3000/
成功访问根路径将返回以下 JSON 响应：
{ "hello": "world" }
结论
在此文中，我们了解了如何在 Fastify 应用程序中设置 CORS ，以及如何使用 fastify-cors 插件做到这一点。您可以使用这些选项来自定义策略，以便让您的应用程序允许从其他源提供服务，同时仍然保持安全性。希望这篇文章能帮助您更好地理解 CORS ，并为实现安全、灵活的 Netlify 应用程序提供良好的指导。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/672dd9baeedcc8a97c862513
