[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"getwebinfo":3,"news-item-12":4},null,{"classListRes":-1,"articleRes":5},{"code":6,"msg":3,"data":7,"total":3},200,{"id":8,"dwo_html":9,"dwo_name":10,"dwo_image":11,"dwo_time":12,"dwo_brief":13,"dwo_keywords":14,"dwo_cid":15,"dwo_show":16,"dwo_uid":17,"dwo_status":18,"dwo_comment_count":19,"dwo_status_reason":3,"dwo_status_time":3,"status_text":20},12,"\u003Ch2>一、前端源码下载\u003C\u002Fh2>\u003Cp>下载地址：购买授权后寻找站长获取！\u003C\u002Fp>\u003Ch2>二、操作步骤\u003C\u002Fh2>\u003Ch3>步骤1：安装Node.js环境\u003C\u002Fh3>\u003Col>\u003Cli>登录宝塔面板，安装「Node.js版本管理器」插件；\u003C\u002Fli>\u003Cli>安装Node.js ≥22.x版本（无对应版本则点击「更新版本列表」）。\u003C\u002Fli>\u003C\u002Fol>\u003Ch3>步骤2：创建客户端文件夹\u003C\u002Fh3>\u003Cp>前往PHP项目所在目录，新建「客户端文件夹」（建议直接放在PHP项目内，便于管理）。\u003C\u002Fp>\u003Ch3>步骤3：上传并解压源码\u003C\u002Fh3>\u003Col>\u003Cli>将下载的前端源码压缩包上传至新建的客户端文件夹；\u003C\u002Fli>\u003Cli>解压压缩包，确保源码文件完整释放。\u003C\u002Fli>\u003C\u002Fol>\u003Ch3>步骤4：配置后端域名与端口\u003C\u002Fh3>\u003Col>\u003Cli>打开源码目录下的 server\u002Fruntime.config.json 文件；\u003C\u002Fli>\u003Cli>修改「后端域名」为实际的系统后端域名；\u003C\u002Fli>\u003Cli>端口可自定义（默认5219），确保端口未被占用。\u003C\u002Fli>\u003C\u002Fol>\u003Ch3>步骤5：部署Node.js项目\u003C\u002Fh3>\u003Col>\u003Cli>宝塔面板 → 网站 → Node.js项目 → 新增项目；\u003C\u002Fli>\u003Cli>命令行版本选择22.x及以上；\u003C\u002Fli>\u003Cli>项目目录：选择前端源码解压后的「server」文件夹；\u003C\u002Fli>\u003Cli>启动选项：自定义启动命令，指定启动文件为 index.mjs；\u003C\u002Fli>\u003Cli>端口号：填写5219（或步骤4中修改的自定义端口）；\u003C\u002Fli>\u003Cli>输入系统域名，点击「确定」；\u003C\u002Fli>\u003Cli>若启动失败，将运行用户改为root后重试。\u003C\u002Fli>\u003C\u002Fol>\u003Ch3>步骤6：配置PHP项目伪静态\u003C\u002Fh3>\u003Col>\u003Cli>进入宝塔对应PHP项目的「伪静态」设置页；\u003C\u002Fli>\u003Cli>粘贴以下配置（注意：替换路径为实际前端源码路径）：\u003C\u002Fli>\u003C\u002Fol>\u003Cpre>\u003Ccode class=\"language-nginx\">location ~* ^\u002F(public|apis|av1|av2|dapi)\u002F {\n  try_files $uri $uri\u002F \u002Findex.php?$query_string;\n}\nlocation ~ ^\u002F_nuxt\u002F(.*)$ {\n    alias \u002Fwww\u002Fwwwroot\u002Fxxx\u002Fnewweb\u002Fpublic\u002F_nuxt\u002F$1;  # 替换为实际路径\n}\n\nlocation \u002F {\n        proxy_pass http:\u002F\u002F127.0.0.1:5219;  # 端口与步骤4、5保持一致\n        proxy_set_header Host $host:$server_port;\n        proxy_set_header X-Real-IP $remote_addr;\n        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n        proxy_set_header REMOTE-HOST $remote_addr;\n        add_header X-Cache $upstream_cache_status;\n        proxy_set_header X-Host $host:$server_port;\n        proxy_set_header X-Scheme $scheme;\n        proxy_connect_timeout 30s;\n        proxy_read_timeout 86400s;\n        proxy_send_timeout 30s;\n        proxy_http_version 1.1;\n        proxy_set_header Upgrade $http_upgrade;\n        proxy_set_header Connection \"upgrade\";\n    }\n    3. 保存配置并重启PHP项目，完成前端UI更新部署。\u003C\u002Fcode>\u003C\u002Fpre>\u003Ch2>三、注意事项\u003C\u002Fh2>\u003Cul>\u003Cli>Node.js版本必须≥22.x，否则可能导致项目启动失败；\u003C\u002Fli>\u003Cli>端口需全程统一，避免出现对接异常；\u003C\u002Fli>\u003Cli>伪静态配置中的路径需准确替换，否则会出现资源加载失败问题；\u003C\u002Fli>\u003Cli>若部署后无法访问，可检查端口是否开放、域名解析是否正确。\u003C\u002Fli>\u003C\u002Ful>\u003Cp>\u003Cbr>\u003C\u002Fp>","前端UI更新操作指引（单域名部署）","https:\u002F\u002Foss4liview.moji.com\u002Fthd_file\u002F2025\u002F12\u002F16\u002F72d96811fa32a1b296f46e5bafd760db.png","2025-12-19 10:38:10","本文档适用于CansCode API管理系统单域名部署场景下的前端UI更新，面向系统管理员。文档提供从环境准备、源码配置到项目部署的完整步骤，帮助快速完成前端界面更新，确保与后端系统正常对接。","前端部署教程,UI更新指南,Node.js部署,Nuxt前端配置,宝塔部署教程,前端源码部署",4,"1",16,1,0,"已上架"]