芋道源码:VUE3部署:避坑--验证码不现显示,管理后台无法访问后端接口等,完善中。。。

起因:

测试芋道源码vue3部署到服务器,实现域名访问。

本人采用的是宝塔面板安装方式

其实别的安装方式原理都相同,可以采取自己喜欢的方式即可。

大致安装步骤看芋道源码的过程即可,本文主要解决无法解决前端找不到后端问题,适合跟我一样小白的选手,高手请略过。

错误信息1:

后台验证码不显示

若是IP部署的话不存在这个问题,只有域名时候才会有

原因:没有将请求正确的发送到后端,

解决方法:在前端也设置一个伪静态(芋道手册仅设置一个方式404错误的伪静态),将前端代码转换到后端的域名中,还是识别的admin-api、app-api

完整伪静态代码放下面

复制代码
# 请将伪静态规则或自定义NGINX配置填写到此处
location / { 
  try_files $uri $uri/ /index.html; ## 重要!!!解决前端刷新 404 问题
}
# -----------------以上是安装说明上解决404问题的----------
# -----------------------------------------------------
# -----------------下面是解决问题添加的一个代理-----------
# -----------------域名是后端绑定的域名------------------
# 请将伪静态规则或自定义NGINX配置填写到此处
location /admin-api/ { ## 后端项目 - 管理后台
    proxy_pass https://liyan.fengxiang.cn/admin-api/; ## 重要!!!proxy_pass 需要设置为后端项目所在服务器的 IP
    proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header REMOTE-HOST $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

location /app-api/ { ## 后端项目 - 用户 App
    proxy_pass https://liyan.fengxiang.cn/app-api/; ## 重要!!!proxy_pass 需要设置为后端项目所在服务器的 IP
    proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header REMOTE-HOST $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

将下面的添加上,问题就解决了,就是因为芋道源码教程说明这地方说的比较含糊。所以容易卡在这,希望有帮助。

相关推荐
咖啡八杯20 小时前
GoF设计模式——解释器模式
java·后端·spring·设计模式
优橙教育20 小时前
5G网优培训 vs Java开发:转行选哪个?
java·开发语言·5g
糖果店的幽灵20 小时前
【DeepAgents 从入门到精通】Context Management 上下文管理
java·人工智能·后端·spring·中间件·langgraph·deepagents
腻害兔1 天前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:字典、短信、邮件、通知——后台系统的“基础设施四件套“!
java·前端·vue.js·产品经理·ai编程
碎光拾影1 天前
ARM交叉工具链各工具作用及IMX6ULL平台LED+蜂鸣器裸机程序实现
java·开发语言·数据库
Miao121311 天前
微服务 API 测试实践:海外某民宿平台如何构建模式驱动测试基础设施
java·开发语言
腻害兔1 天前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:支付模块 yudao-module-pay,一个让产品经理都看懂的支付中台设计
java·前端·vue.js·产品经理·ai编程
CRMEB系统商城1 天前
开源自建还是SaaS订阅?算一笔3年经济账
java·大数据·开发语言·开源
keyipatience1 天前
线程栈与TLS和线程互斥
java·linux·服务器·开发语言·ubuntu
weixin_408099671 天前
2026 图片去水印 API 接口完全指南:一键去除图片水印(附 Python/Java/PHP/C# 示例)
java·python·php·图片处理·api调用·图片去水印·石榴智能