总结

• 推荐使用代理： 本地开发环境使用正向代理，部署到服务器生产环境在后端使用反向代理。

• 为什么推荐代理： 部署的时候，改一下配置文件，重启一下环境就完事了。很多情况下，可能后端有很多节点。

• 为什么不推荐手动处理： 因为涉及部署方案，后端节点不同，可能会非常复杂。涉及后端节点修改、可能还得走申请、改代码、审批、构建、发包、打补丁等一堆流程。

跨域请求是指在浏览器中，从一个域名的网页去请求另一个域名的资源。跨域请求是受到浏览器的同源策略（Same Origin Policy）限制的，该策略要求浏览器只能发送同源（协议、域名、端口号相同）的请求。

一般在 Node.js 中解决这类跨域问题，有以下三个思路：

一、正向代理

正向代理指客户端用 proxy 解决

正向代理指的是在客户端架设代理，该代理和客户端同域名同端口，属于同源。而代理和服务端之间不存在同源策略限制，即不存在跨域问题。大多数情况下，我们会使用中间件proxy、http-proxy-middleware来架设代理，同时在代码中将接口的请求地址改为该代理的地址和端口来帮我们解决这个问题。

有些前端工程内置了一些 proxy 配置，我们可以启动该配置来

一般来说主要用两种情况：

• 前端工程运行：未编译的前端代码直接通过npm run命令直接在服务器上启动，代理直接运行在该服务上。
• 静态代码托管：指的是编译后的静态代码或者非工程代码，使用 Node.js 中间件（如 Express）、容器（docker）托管运行，然后借助代理中间件配置来转发请求。

二、反向代理

反向代理指服务端配置 CORS 解决

反向代理是指以代理服务器来接收客户端的请求，然后将请求转发给内部网络上的服务器，将从服务器上得到的结果返回给客户端，此时代理服务器对外表现为一个反向代理服务器。对于客户端来说，反向代理就相当于目标服务器，只需要将反向代理当作目标服务器一样发送请求就可以了，并且客户端不需要进行任何设置。一般我们会在服务端给接口的响应头配置CORS信息。

主要分为这几种情况：

• 代理服务器：比如我们可以通过配置 Nginx 服务服务器，自动的给接口的响应报文添加 CORS 信息
• Node.js：我们可以在响应报文里手动添加，也可以应用一些中间件如 CORS 来处理。

大多数情况下，我们推荐使用Nginx和Node.js中间件来解决

三、手动处理

手动处理指在代码里处理，可能涉及到版本变更，打补丁、构建发包等流程，不推荐，流程麻烦

手动处理指的是，在接口的响应报文里手动添加 CORS 信息。

以Java为例子：

public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  response.setHeader("Access-Control-Allow-Origin", "http://foo.example");
  response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS");
  response.setHeader("Access-Control-Allow-Headers", "X-PINGOTHER, Content-Type");
}

更新日志

2025/8/24 08:17

查看所有更新日志

• e7112-1于 2025/8/24