安装 EZ-THEME-R 前端主题教程-技术教程

针对你已经安装好 Node.js 的环境，以下是前端项目（V3Board）配置、对接中间件并最终编译的详细操作步骤：

1. 修改前端配置文件

在开始编译之前，必须先配置前端，使其通过你的中间件（Proxy Server）进行通信。

在 aaPanel 文件管理器中，找到前端源码目录（例如 /www/wwwroot/v3-build）。
进入 src/config/ 目录，打开 index.js 文件。
找到以下关键字段并修改：
- API_MIDDLEWARE_ENABLED: 设置为 true。
- API_MIDDLEWARE_URL: 填写你为中间件配置的反向代理域名，例如 "https://api.xxxxx.cc"。
- API_MIDDLEWARE_PATH: 保持默认的 "/ez/ez"（需与中间件 .env 中的 PATH_PREFIX 一致）。
- API_MIDDLEWARE_KEY: 填写你在中间件 .env 中设置的 AES_KEY（例如 "4c6f8e5f9467dc71"）。

2. 执行编译命令

回到 SSH 终端，进入前端源码根目录执行编译。

安装依赖包：为了加快速度，建议使用国内镜像源：npm install
开始生产环境构建：执行打包命令，这会将源码转换成浏览器可读的静态文件：npm run build
获取产物：编译完成后，当前目录下会出现一个 dist 文件夹。这个文件夹里的内容就是最终要上线的网站代码。

3. 部署编译后的文件

你需要将 dist 文件夹内的内容传输到你真正的生产服务器（第一台 VPS）。

打包产物：zip -r dist.zip dist/
上传与解压：
- 将 dist.zip 上传到第一台服务器对应的网站根目录（如 go.xxxxx.de）。
- 解压并将 dist 目录内的所有文件（index.html, assets 文件夹等）移动到网站根目录。

4. 验证部署结果

访问你的前端域名（如 https://go.xxxxxx.de）。
尝试登录，并按 F12 查看网络请求。
如果配置成功，你应该能看到所有的 API 请求都在向你的中间件域名（如 api.xxxxx.cc/ez/ez/...）发送，且数据请求是经过加密的。

二、你不能把 `staticBaseUrl` 修改为订阅路径。

在 V2Board/XBoard 的架构中，API 接口（用于登录、获取用户信息、购买套餐）和订阅路径（用于下发节点配置）是完全不同的两个概念：

API 基础路径：必须保持为 /api/v1，否则前端无法登录，会一直提示“配置加载失败”。
订阅路径：你在面板后台修改的 /static/user/profile 仅仅是给客户端（如 Clash, Shadowrocket）使用的，不需要写在前端的 staticBaseUrl 里。

正确的修改方案

请将 export const config 修改回标准 API 格式。只要你在后端面板里设置好了订阅路径，前端会自动获取到正确的链接。

JavaScript

export const config = {
    // 1. 确认面板类型
    PANEL_TYPE: 'V2board', 

    // API配置
    API_CONFIG: {
        // 使用静态URL模式
        urlMode: 'static',

        showCheckBackend: false,

        // 2. 这里必须填 API 接口地址，一定要加 /api/v1，不能填你的订阅路径！
        staticBaseUrl: [
            'https://xxx.gggg.de/api/v1'
        ],

        // 自动获取模式配置
        autoConfig: {
            useSameProtocol: true,
            appendApiPath: true,
            // 3. 这里也必须保持默认的 /api/v1
            apiPath: '/api/v1'
        }
    },

    // 4. 关闭中间件（除非你确定要用它加密）
    API_MIDDLEWARE_ENABLED: false,

    // 中间件相关配置（已关闭则不生效）
    API_MIDDLEWARE_URL: 'https://xxx.gggg.de',
    API_MIDDLEWARE_KEY: '4c6f8e5f9467dc71',
    API_MIDDLEWARE_PATH: '/ez/ez',

为什么不能改？

登录失败：如果你把 API 路径改为 /static/user/profile，当你点击登录按钮时，前端会尝试访问 https://office.xxxxx.de/static/user/profile/passport/auth/login。由于后端并没有这个路径，你会直接收到 404 错误 或 请求资源不存在。
订阅自动下发：前端代码逻辑是：先通过 /api/v1/user/info 接口请求用户信息，后端返回的数据里会包含你设置好的 https://gooo.xxxxx.de/static/user/profile?token=xxx。前端会自动把这个链接展示在页面上，无需手动配置。

总结

前端代码：请务必保持 staticBaseUrl 指向 https://office.xxxxxx.de/api/v1。
后端面板：保持你截图中的 /static/user/profile 设置不变。
重新编译：修改完代码后，再次运行 npm run build 并部署。