什么是 CORS
CORS（Cross-Origin Resource Sharing）是一种浏览器安全策略，用于限制网页或 Web 应用程序的跨源 HTTP 请求。简单来说，当你在一个网站上请求另一个域的资源时，浏览器会默认阻止这个请求，这就是跨域问题。
CORS 跨域问题的解决方案
在 Express.js 中，我们可以通过设置响应头来解决 CORS 跨域问题。
设置响应头
在 Express.js 中，我们可以通过设置响应头来允许跨域请求。在响应头中设置 Access-Control-Allow-Origin 字段，该字段的值为允许跨域请求的源，可以是单个域名、多个域名或 *（表示所有域名都允许跨域请求）。
------------- ---- ----- -- - -------------------------------------------- ----- ------- ---
支持跨域请求的方法
除了设置响应头以外，我们还需要设置支持跨域请求的方法，包括 GET、POST、PUT、DELETE 等。在响应头中设置 Access-Control-Allow-Methods 字段，该字段的值为支持跨域请求的方法。
------------- ---- ----- -- - -------------------------------------------- ----- --------------------------------------------- ----- ----- ---- --------- ------- ---
支持跨域请求的请求头
有些请求需要在请求头中添加一些自定义字段，例如 token 等。在响应头中设置 Access-Control-Allow-Headers 字段，该字段的值为支持跨域请求的请求头。
------------- ---- ----- -- - -------------------------------------------- ----- --------------------------------------------- ----- ----- ---- --------- --------------------------------------------- -------------- ---------------- ------- ---
支持跨域请求的凭证
有些请求需要在请求头中携带凭证信息，例如 cookie 等。在响应头中设置 Access-Control-Allow-Credentials 字段，该字段的值为 true。
------------- ---- ----- -- - -------------------------------------------- ----- --------------------------------------------- ----- ----- ---- --------- --------------------------------------------- -------------- ---------------- ------------------------------------------------- ------ ------- ---
示例代码
以下是一个使用 Express.js 解决 CORS 跨域问题的示例代码：
----- ------- - ------------------- ----- --- - ---------- ------------- ---- ----- -- - -------------------------------------------- ----- --------------------------------------------- ----- ----- ---- --------- --------------------------------------------- -------------- ---------------- ------------------------------------------------- ------ ------- --- -------------------- ----- ---- -- - ---------- -------- ------- ------- --- --- ---------------- -- -- - ------------------- -- ------- -- ------------------------ ---
在浏览器中访问 http://localhost:3000/api/data，你应该能够得到一个 JSON 格式的响应，其中包含一个 message 属性，值为 Hello, world!。
总结
CORS 跨域问题是前端开发中常见的问题，解决起来也比较简单。在 Express.js 中，我们只需要设置响应头来允许跨域请求，同时设置支持跨域请求的方法、请求头和凭证即可。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6509941995b1f8cacd444aa6