在使用 Express.js 开发 API 时，有时候会遇到请求被拒绝的问题，这可能是由于跨域请求、CORS 限制等原因造成的。本文将详细介绍这些问题的原因，并提供解决方案，帮助读者更好地理解和解决这些问题。
什么是跨域请求？
跨域请求是指在浏览器中，通过 JavaScript 发送的请求，目标地址与当前页面的地址不一致的情况。例如，当前页面的地址是 http://localhost:3000，而请求的地址是 http://api.example.com，这就是一个跨域请求。
跨域请求存在的问题是，浏览器默认不允许跨域请求，这是出于安全考虑，防止恶意网站利用跨域请求窃取用户信息。因此，如果一个 API 服务需要接受跨域请求，就必须要进行特殊的处理，否则浏览器会拒绝这些请求。
解决跨域请求的问题
在 Express.js 中，解决跨域请求的问题有多种方法，以下是其中的两种常用方法。
使用 CORS 中间件
CORS 是一种跨域资源共享的机制，通过在服务端设置响应头，告诉浏览器该服务允许跨域请求，从而解决跨域请求的问题。
在 Express.js 中，可以使用 cors 中间件来实现 CORS 功能。首先，在项目中安装 cors：
npm install cors
然后，在 Express.js 中使用 cors：
const express = require('express');
const cors = require('cors');
const app = express();
app.use(cors());
// ... 其他路由使用 cors 中间件后，Express.js 会在响应头中添加 Access-Control-Allow-Origin 字段，告诉浏览器该服务允许跨域请求。如果需要更多的 CORS 配置，可以参考 cors 的文档。
设置响应头
除了使用 cors 中间件，还可以手动设置响应头，告诉浏览器该服务允许跨域请求。在 Express.js 中，可以通过设置响应头来实现：
const express = require('express');
const app = express();
app.get('/api', (req, res) => {
res.header('Access-Control-Allow-Origin', '*');
res.send('Hello World!');
});在上面的示例中，res.header('Access-Control-Allow-Origin', '*') 表示设置响应头，允许任意源的跨域请求。如果需要更多的 CORS 配置，也可以手动设置响应头来实现。
示例代码
以下是一个完整的 Express.js API 代码示例，其中包含了使用 cors 中间件和手动设置响应头两种方法来解决跨域请求的问题。
-- -------------------- ---- ------- ----- ------- - ------------------- ----- ---- - ---------------- ----- --- - ---------- -- -- ---- --- ---------------- -- ------- --------------- ----- ---- -- - ----------------------------------------- ----- --------------- --------- --- ---------------- -- -- - ------------------- -- ------- -- ------------------------ ---
总结
本文介绍了 Express.js API 请求被拒绝的问题，以及解决这些问题的方法。通过本文的学习，读者可以更好地理解跨域请求、CORS 机制等相关概念，并掌握使用 Express.js 解决跨域请求的方法。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65c44134add4f0e0ffeb5b7e