介绍
在前端开发中，很多时候需要调用来自其他域名下的 API 接口，但是浏览器的跨域限制会限制这种操作。cors（跨域资源共享）是一种解决跨域问题的方法，简单来说，服务端添加一些特殊的响应头，告诉浏览器该域名可以被跨域访问，这样就可以解决了跨域问题。
servie-cors 是一个 npm 包，它可以帮助你更方便地添加 cors 相关的头信息，下面我们来详细介绍一下 servie-cors 的使用方法。
安装
使用 npm 安装 servie-cors：
npm install --save servie-cors
使用
第一步：引入 servie-cors
const servieCors = require('servie-cors');第二步：添加 cors 头信息
使用 servie-cors 添加 cors 头信息非常简单，我们只需要在需要添加 cors 头信息的请求上调用 servieCors 这个函数即可。
-- -------------------- ---- ------- ----- --- - --------------------- ---------------------- -------------------- ----- ---- -- - ---------- -------- ------ ------- --- --- ---------------- -- -- - ------------------- --------- -- ---- -------- ---
上面的例子展示了如何在 express 中使用 servie-cors，我们通过调用 use 函数来添加中间件，然后在需要添加 cors 头信息的接口上调用 servieCors 函数，这样就可以添加 cors 头信息了。
配置 cors 头信息
servie-cors 的默认配置非常简单，只会把 Access-Control-Allow-Origin 头信息设置为 *，也就是允许所有域名访问。但是在实际项目中，我们可能需要更复杂的配置，比如只允许特定的域名访问。
为了更好地满足需求，servie-cors 提供了一个配置对象，可以通过这个对象来自定义 cors 头信息的配置。
下面是一个例子：
app.use(servieCors({
origin: 'http://localhost:3001',
methods: ['GET', 'POST'],
allowedHeaders: ['Content-Type', 'Authorization']
}));在上面的例子中，我们通过配置 origin，methods 和 allowedHeaders 属性，来限制 cors 访问。其中：
origin：用来限制允许访问的域名，默认值为*。当我们把它设置为具体的域名时，只有这个域名可以访问我们的接口。methods：用来限制请求方法，比如 GET、POST 等。默认值为GET。allowedHeaders：用来限制请求头信息，默认值为Content-Type。
你可以根据实际情况自定义自己的 cors 配置。
示例代码
最后，我们来看一下完整的示例代码。
-- -------------------- ---- ------- ----- ------- - ------------------- ----- ---------- - ----------------------- ----- --- - ---------- -- -- ---- -------------------- ------- ------------------------ -------- ------- -------- --------------- ---------------- ---------------- ---- -- --- -- -------------------- ----- ---- -- - ---------- -------- ------ ------- --- --- ---------------- -- -- - ------------------- --------- -- ---- -------- ---
总结
使用 servie-cors 可以更方便地添加 cors 头信息，从而解决跨域问题。在使用时，我们可以根据需要自定义配置来实现更加灵活的控制。希望这篇教程可以帮助到你，让你更好地应对跨域问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60067350890c4f72775838cd