在构建前端应用程序的过程中，很多时候我们都需要从后端获取数据。然而，由于同源策略的存在，现代浏览器会限制跨域请求，这就导致了我们在开发时可能会遇到 CORS 问题。
CORS 是一个安全机制，可以防止其他域名的 JavaScript 脚本访问您的资源，但同时也可以防止您的前端应用程序访问其他域的资源。因此，为了避免这种限制，我们需要在后端服务器中配置 CORS。
Express.js 是 Node.js 的 Web 框架，它提供了易于使用且灵活的方法来处理 CORS 问题。在本文中，我们将详细介绍如何在 Express.js 中使用 CORS 解决跨域请求的问题，并提供一些示例代码来帮助您开始实现。
安装和引入 CORS 中间件
在 Express.js 中，我们使用中间件来处理请求和响应。这允许我们编写可重用的代码，并将其应用于特定的请求路径或路由。要在 Express.js 中使用 CORS，我们需要安装和引入 CORS 中间件。
您可以使用 npm 包管理器来安装 cors 中间件：
--- ------- ----
一旦您安装了该中间件，可以将它引入到您的 Express.js 应用程序中：
----- ------- - ------------------- ----- ---- - ---------------- ----- --- - ---------- ----------------
在上面的代码中，我们将 cors 中间件在我们的 Express.js 应用程序中引入并使用。这将为所有路由和请求启用 CORS。
配置 CORS 选项
CORS 中间件提供了一些可配置的选项。这些选项可以用于限制跨域请求的范围、允许特定的域名或请求方法、设置响应头等。
以下是一些示例选项：
origin：表示允许的请求源，您可以使用字符串、正则表达式、函数等形式来指定允许的来源。methods：表示允许的请求方法，您可以使用逗号分隔的字符串形式来指定允许的方法。allowedHeaders：表示允许的请求头，您可以使用逗号分隔的字符串形式来指定允许的请求头。exposedHeaders：表示允许访问的响应头，您可以使用逗号分隔的字符串形式来指定允许访问的响应头。
以下是一些配置选项的示例：
----- ----------- - - ------- ---------------------- -------- ---------------------- --------------- ----------------------------- --------------- ------------------------ ------------ ----- ------- ---- -- ---------------------------
处理预请求
在使用跨域请求时，浏览器会发送 OPTIONS 请求以查看是否允许跨域请求。这种类型的请求被称为预请求。在处理预请求时，需要响应一个 CORS 头以表明允许跨域请求。
下面是一个如何处理预请求的示例代码：
---------------- --------
在这个例子中，我们为所有请求路径设置了预请求处理程序。这将允许所有跨域请求通过。
允许凭据
在默认情况下，浏览器不允许跨域请求包含凭据（如 Cookie 和 HTTP 认证）。如果您需要允许这些凭据通过跨域请求，请设置 credentials 选项为 true。
----- ----------- - - ------------ ---- -- ---------------------------
请注意，启用此选项可能会引入安全漏洞。在使用时，请确保您的服务器已经受到了适当的保护。
结论
在本文中，我们介绍了在 Express.js 中解决跨域请求的问题。我们详细介绍了如何使用 CORS 中间件来为您的 Express.js 应用程序配置 CORS 选项，处理预请求，以及允许凭据通过跨域请求。我们提供了示例代码来帮助您在自己的应用程序中实现这些功能。
希望本文可以为您解决在前端开发过程中遇到的 CORS 问题，帮助您更好地构建应用程序。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/67308cddeedcc8a97c923cf3