宝塔部署Java+Vue前后端分离项目

1. 服务器

服务器选择Linux的CentOS7的版本

2. 宝塔Linux面板

2.1 百度搜索宝塔

2.2 进去之后点击立即免费安装

2.3 选择Linux在线安装,输入服务器信息进行安装(也可以选择其他方式)

安装完成之后会弹一个宝塔的应用面板,并附带有登录名称和密码,这个要自己记下来的。

然后我们在浏览器打开这个面板,输入刚刚的名称和密码就能登录到该管理界面了。

3. 搭建Linux项目运行环境

3.1 创建MySql数据库,保存用户名和密码,上传sql文件并导入

3.2 安装配置Redis

比如我的项目中用到了Redis,那就对应的再安装一个Redis就行了呀,然后进行配置就可以。

我的项目中因为配置文件中没有设置Redis的密码和IP什么的,所以项目默认就会采用本机的Redis,其他的需要配置就配置没有配置就用默认的配置就可以。

4. 部署Java项目

4.1 创建文件夹,上传jar包

4.2 添加Java项目

4.2 启动后端服务

4.2 添加Java项目

5. 部署Vue项目

5.1 上传dist压缩包,并解压

5.2 第一种方式:通过nginx访问

复制代码
server {
    listen       80;
    server_name  localhost;
    charset utf-8;

    location / {
        root /www/project/dist;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html;
    }

    location /accounting {
        alias  /www/project/dist1;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html;
    }

    location /prod-api/ {
        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;
        proxy_pass http://localhost:8081/;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}

5.2 第二种方式:选择网站 -> PHP项目 -> 添加站点

  1. 域名填写公网ip(可以加上端口号)

  2. 根目录选择解压的dist

  3. PHP版本选择纯静态

5.3 修改配置文件

访问前端页面刷新出现404,添加下面代码

复制代码
location / {
    try_files $uri $uri/ /index.html;
}

添加接口路径

复制代码
location /api/ {
    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;
    proxy_pass http://localhost:8081/;
}
相关推荐
ZHOUPUYU几秒前
我在PHP里学到的“套路”与“反套路” 设计模式与依赖注入
开发语言·php
意疏4 分钟前
openJiuwen实战:用AsyncCallbackFramework为Agent增强器添加可观测性
java·服务器·前端
马士兵教育5 分钟前
2026年IT行业基本预测!计算机专业学生就业编程语言Java/C/C++/Python该如何选择?
java·开发语言·c++·人工智能·python·面试·职场和发展
wuhen_n5 分钟前
5年前端,我为什么要all in AI Agent?
前端·vue.js·ai编程
Book思议-14 分钟前
顺序表和链表核心差异与优缺点详解
java·数据结构·链表
optimistic_chen20 分钟前
【Vue入门】创建Vue工程环境和响应式函数
前端·javascript·vue.js·前端框架·html
野犬寒鸦34 分钟前
面试常问:HTTP 1.0 VS HTTP 2.0 VS HTTP 3.0 的核心区别及底层实现逻辑
服务器·开发语言·网络·后端·面试
林恒smileZAZ35 分钟前
告别满屏 v-if:用一个自定义指令搞定 Vue 前端权限控制
前端·javascript·vue.js
小杨的博客37 分钟前
Java + Selenium实现浏览器打印功能
java·selenium
geovindu38 分钟前
python: Null Object Pattern
开发语言·python·设计模式