Fastify 如何处理 CORS 跨域请求-JavaScript中文网-JavaScript教程资源分享门户

跨域请求在前端开发中非常常见，CORS（跨域资源共享）是处理跨域请求的常用方式之一。而 Fastify 是一个快速和低开销的 Web 框架，本文将介绍如何在 Fastify 中处理跨域请求。

什么是 CORS？

CORS 是一种通过添加一些 HTTP 头来让浏览器和服务器进行跨域通信的机制。在默认情况下，浏览器会阻止从一个不同源的服务器向当前页面发出的 AJAX 请求，这是为了保护用户的安全。但有时候我们确实需要实现这样的跨域请求，因此就需要使用 CORS。

CORS 是通过在服务器端设置 HTTP 头信息来实现的。比如，你可以在请求的响应中添加一个名为 Access-Control-Allow-Origin 的头部，并使用 * 允许任何来源的请求，就可以让服务端支持 CORS 跨域请求了。

Fastify 中的 CORS 设置

Fastify 提供了一个名为 fastify-cors 的插件，该插件可以用来处理跨域请求。下面我们就来介绍如何使用该插件实现 CORS 跨域请求。

安装 fastify-cors

首先，我们需要安装 fastify-cors：

npm install fastify-cors --save

引入 fastify-cors

在 Fastify 应用程序中引入 fastify-cors :

const fastify = require('fastify')()
const cors = require('fastify-cors')

fastify.register(cors)

开启 CORS 支持

使用 fastify-cors 之后，你可以使用 fastify.use() 在路由级别或全局级别配置 CORS。例如：

fastify.use(cors())

或者，如果要指定不同的参数，可以进行如下配置：

fastify.use(cors({
  origin: '*',
  methods: 'GET,HEAD,PUT,PATCH,POST,DELETE',
  preflightContinue: false,
  optionsSuccessStatus: 204
}))

以上代码会允许任何来源的请求，并支持 GET、HEAD、PUT、PATCH、POST 和 DELETE 方法。如果需要支持其他方法，可以加入到 methods 参数中。

具体的示例

下面是一个完整的示例：

// javascriptcn.com 代码示例
const fastify = require('fastify')()
const cors = require('fastify-cors')

fastify.register(cors())

// 路由
fastify.get('/', (request, reply) => {
  reply.send({ hello: 'world' })
})

// 启动服务器
fastify.listen(3000, (err, address) => {
  if (err) throw err
  console.log(`Server listening on ${address}`)
})

上述代码表示，我们在 Fastify 中引入了 fastify-cors，然后在应用程序的全局级别添加了 CORS 支持。我们的路由仍然可以像往常一样进行定义，启动服务器时也可以像往常一样监听端口。

总结

本文介绍了在 Fastify 中如何处理 CORS 跨域请求，通过 fastify-cors 插件，我们可以在 Fastify 应用程序中添加全局级别的 CORS 支持，从而避免跨域请求的限制。希望这篇文章对你有所帮助。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/6549c49b7d4982a6eb40130d