Nodejs 使用 node 代理域名，整合微信公众号授权测试环境域名到统一域名

发布于 1周前 作者 gougou168 来自 nodejs/Nestjs

Nodejs 使用 node 代理域名，整合微信公众号授权测试环境域名到统一域名
事件起因：
由于公司众多项目需要微信公众号授权，同时又分为测试环境和正式环境，所以每个项目至少需要两个域名在微信公众号后台进行配置，每个公众号只能配置 3 个授权域名，目前公众号已经严重不足，因此需要一个解决方案。

初步设想：
由于之前各个域名都不一样，所以希望整合到一个域名下，通过二级目录的方式访问不同的项目，由于本人纯前端，所以打算用 node+express+request 实现反向代理。通过维护一个 config.js 文件来配置每个二级目录对应需要反代到的域名下。如下：
{
“xxx”: “xxx.test.example.com”,
“yyy”: “yyy.test.example.com”,
}
此时访问页面 wx-test.xxx.com/xxx 将会把所有资源都反代到 xxx.test.example.com 的域名下。这样只需要在微信后台配置一个 wx-test.xxx.com 一个域名即可（由于其他问题，不希望对旧的域名进行更改，尽量不影响旧的测试域名的使用 以及前端现有的构建方式和当前代码）

遇到问题：
1.由于每个当前每个项目前端访问接口的 url 都是 “/api/xxx/xxx ” 的方式，导致请求时候直接跳过了设置的二级目录，因此无法知道当前接口需要反代到哪个域名下
2.同 1 问题，由于 vue 打包后大部分静态资源的请求 url 为 “/static/xxx/xxx ” ，同样由于请求路径不包含二级目录，无法知道需要反代到的地址
3.api 接口请求 cookie 的 domain 和 path 设置导致 cookie 失效

解决方案：
1.通过获取 requst 的 header 信息里的 referer 获取到发起请求的 url 的二级目录，获取反代地址
2.同上
3.在接口请求后重新编写 cookie 内容

新问题：
通过 header 的 referer 字段可以有效的获取到 /api 和 /static 的文件的二级目录如：/xxx/。但此时一些图片资源如果是从 css 文件里请求的，如 background 里的图片，由于是 css 文件发起的请求，此时的 referer 信息获取的只能是 wx-test.xxx.com/static/xxx/xxx.css 则无法获取到需要的二级目录信息。导致图片资源请求无法知晓需要反代的 url 导致请求失败。

当前解决方案：
通过设置一个全局变量如 domain 在每次有发起反代时在能获取到 referer 的二级目录不为 static 时，将当前的反代域名保存在当前全局变量 domain，当图片资源无法获取到反代地址时，反代到全局变量 domain
此时如果只有一个人访问页面可以实现反代并且微信授权通过，问题是当有几个人同事请求时，会导致 css 文件里请求的静态资源混乱

以上，不知道大家有没有什么解决方案可以解决这个问题（尽量不去改现有各项目的前端代码）


Harmonyos Next教程
1 回复

在Node.js中使用代理服务器来整合微信公众号授权测试环境域名到统一域名，你可以使用http-proxy-middleware这个中间件来实现。以下是一个基本的示例代码，展示如何设置代理服务器来转发请求。

首先，确保你已经安装了express和http-proxy-middleware：

npm install express http-proxy-middleware

然后，创建一个简单的Node.js服务器，并配置代理：

const express = require('express');
const { createProxyMiddleware } = require('http-proxy-middleware');

const app = express();
const port = 3000;

// 配置代理，假设你要代理到微信公众号授权测试环境的域名
app.use(
  '/wechat-auth',
  createProxyMiddleware({
    target: 'https://your-wechat-auth-test-domain.com', // 替换为你的微信公众号授权测试环境域名
    changeOrigin: true,
    pathRewrite: { '^/wechat-auth': '' }, // 去掉前缀
  })
);

app.listen(port, () => {
  console.log(`Proxy server is running at http://localhost:${port}`);
});

在这个示例中，所有发送到http://localhost:3000/wechat-auth的请求都会被转发到https://your-wechat-auth-test-domain.com，并且路径中的/wechat-auth前缀会被去掉。

这样，你就可以通过统一的域名来访问微信公众号授权测试环境了。只需在配置或代码中引用你的代理服务器地址即可。

回到顶部