程序员scholar 程序员scholar
首页
  • Java 基础

    • JavaSE
    • JavaIO
    • JavaAPI速查
  • Java 高级

    • JUC
    • JVM
    • Java新特性
    • 设计模式
  • Web 开发

    • Servlet
    • Java网络编程
  • Web 标准

    • HTML
    • CSS
    • JavaScript
  • 前端框架

    • Vue2
    • Vue3
    • Vue3 + TS
    • 微信小程序
    • uni-app
  • 工具与库

    • jQuery
    • Ajax
    • Axios
    • Webpack
    • Vuex
    • WebSocket
    • 第三方登录
  • 后端与语言扩展

    • ES6
    • Typescript
    • node.js
  • Element-UI
  • Apache ECharts
  • 数据结构
  • HTTP协议
  • HTTPS协议
  • 计算机网络
  • Linux常用命令
  • Windows常用命令
  • SQL数据库

    • MySQL
    • MySQL速查
  • NoSQL数据库

    • Redis
    • ElasticSearch
  • 数据库

    • MyBatis
    • MyBatis-Plus
  • 消息中间件

    • RabbitMQ
  • 服务器

    • Nginx
  • Spring框架

    • Spring6
    • SpringMVC
    • SpringBoot
    • SpringSecurity
  • SpringCould微服务

    • SpringCloud基础
    • 微服务之DDD架构思想
  • 日常必备

    • 开发常用工具包
    • Hutoll工具包
    • IDEA常用配置
    • 开发笔记
    • 日常记录
    • 项目部署
    • 网站导航
    • 产品学习
    • 英语学习
  • 代码管理

    • Maven
    • Git教程
    • Git小乌龟教程
  • 运维工具

    • Docker
    • Jenkins
    • Kubernetes
  • 算法笔记

    • 算法思想
    • 刷题笔记
  • 面试问题常见

    • 十大经典排序算法
    • 面试常见问题集锦
关于
GitHub (opens new window)
首页
  • Java 基础

    • JavaSE
    • JavaIO
    • JavaAPI速查
  • Java 高级

    • JUC
    • JVM
    • Java新特性
    • 设计模式
  • Web 开发

    • Servlet
    • Java网络编程
  • Web 标准

    • HTML
    • CSS
    • JavaScript
  • 前端框架

    • Vue2
    • Vue3
    • Vue3 + TS
    • 微信小程序
    • uni-app
  • 工具与库

    • jQuery
    • Ajax
    • Axios
    • Webpack
    • Vuex
    • WebSocket
    • 第三方登录
  • 后端与语言扩展

    • ES6
    • Typescript
    • node.js
  • Element-UI
  • Apache ECharts
  • 数据结构
  • HTTP协议
  • HTTPS协议
  • 计算机网络
  • Linux常用命令
  • Windows常用命令
  • SQL数据库

    • MySQL
    • MySQL速查
  • NoSQL数据库

    • Redis
    • ElasticSearch
  • 数据库

    • MyBatis
    • MyBatis-Plus
  • 消息中间件

    • RabbitMQ
  • 服务器

    • Nginx
  • Spring框架

    • Spring6
    • SpringMVC
    • SpringBoot
    • SpringSecurity
  • SpringCould微服务

    • SpringCloud基础
    • 微服务之DDD架构思想
  • 日常必备

    • 开发常用工具包
    • Hutoll工具包
    • IDEA常用配置
    • 开发笔记
    • 日常记录
    • 项目部署
    • 网站导航
    • 产品学习
    • 英语学习
  • 代码管理

    • Maven
    • Git教程
    • Git小乌龟教程
  • 运维工具

    • Docker
    • Jenkins
    • Kubernetes
  • 算法笔记

    • 算法思想
    • 刷题笔记
  • 面试问题常见

    • 十大经典排序算法
    • 面试常见问题集锦
关于
GitHub (opens new window)
npm

(进入注册为作者充电)

  • 高性能服务器 - Nginx

  • 项目部署

    • 带你从0认识云服务器
    • Docker部署SpringBoot项目
    • 华为云部署前后端分离项目
    • 腾讯云服务器部署Hexo博客
    • 宝塔部署前后端分离项目
      • 安装宝塔面板
      • 宝塔安装软件
        • 在服务器命令行中登录MySQL
        • 查看用户表user数据
        • 修改用户表user的host
      • 运行jar部署后端
      • 填写NGINX配置部署前端
    • Spring Boot应用打包与部署
    • 一键部署文件到远程服务器
    • Docker部署项目+环境安装
  • 服务器
  • 项目部署
scholar
2024-01-17
目录

宝塔部署前后端分离项目

# 安装宝塔面板

  1. 执行以下命令进行安装:

CentOS7/8:

yum install -y wget && wget -O install.sh http://download.bt.cn/install/install-ubuntu.sh && sh install.sh
1

Ubuntu18.04/20.04:

wget -O install.sh http://download.bt.cn/install/install_6.0.sh && bash install.sh
1
  1. 安装过程中会提示输入数据库密码等信息,根据提示输入即可。
  2. 安装完成后,在浏览器中输入服务器 IP 地址并访问,即可看到宝塔面板的登录界面。

# 宝塔安装软件

安装MySQL,傻瓜式安装,直接点点点 安装之后使用远程软件连接服务器MySQL会报错 :::info

1130-host ‘..‘ is not allowed to connect to this MySql

# 在服务器命令行中登录MySQL

mysql -u root -p 

use mysql;
1
2
3

# 查看用户表user数据

select Host, User,Password from user;      #其中Password为数据库进入密码
1

# 修改用户表user的host

update user set Host='%' where User='root';
flush privileges;
1
2

这样即可成功!!!

:::info 还需安装其他软件 Java项目管理器(下载之后随便安装一个Tomcat即可获得Java环境) Redis 安装完毕之后配置 所有都可访问 0.0.0.0 以及配置Redis密码(必需) Nginx 首先安装完毕 具体配置后面进一步概述 :::

# 运行jar部署后端

打包后端代码jar包 熟练java项目开发的,可以直接通过InteliJ IDEA或者eclipse软件打jar包。不熟悉的有第二种方法,是若依提供的。进入下载的项目文件夹中的bin目录下,直接双击执行package.bat,它会直接在项目中生成target文件夹,里面包含以及打包好的jar包。我们要使用的是ruoyi-admin文件夹下的target里的jar包。运行package.bat需要marven环境>=3.0,操作顺序如下图: 然后通过下面命令进行运行jar包 :::info 我这里是/home目录下面 :::

nohup java -jar xxxxx   &
1

运行完毕之后,可以在当前运行jar的目录,通过下面命令来看运行的控制台输出。

tail -f nohup.out
1

image.png

:::info 这里我们的后端就部署成功了 :::

# 填写NGINX配置部署前端

打开dos窗口,进入ruoyi-ui文件夹,并对前端代码进行打包,生成一个dist文件夹,这就是前端代码打包后的文件

npm install --unsafe-perm --registry=https://registry.npm.taobao.org
npm run build:prod
1
2

也可以进入ruoyi-ui -> bin目录中 双击鼠标运行build.bat文件 打包后,会生成一个dist文件夹,如图所示: image.png 我们需要通过Xftp将dist文件夹拷贝到我们购买云服务器的一个目录,我这里将其dist文件夹拷贝到home目录门,如下: image.png

到这里我们去宝塔面板配置Linux面板的NGINX配置。

找到NGINX配置修改处,如图: image.png

填入下面的配置,前端就算是配置完毕:

user  www;

worker_processes auto;

error_log  /www/wwwlogs/nginx_error.log  crit;

pid        /www/server/nginx/logs/nginx.pid;

worker_rlimit_nofile 51200;



events

    {
        use epoll;
        worker_connections 51200;
        multi_accept on;
    }

http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    client_max_body_size 100m;


    #用于tomcat反向代理,解决nginx 504错误

    proxy_connect_timeout 7200; #单位秒

    proxy_send_timeout 7200; #单位秒

    proxy_read_timeout 7200; #单位秒

    proxy_buffer_size 16k;

    proxy_buffers 4 64k;

    proxy_busy_buffers_size 128k;

    proxy_temp_file_write_size 128k;

    # ps:以timeout结尾配置项时间要配置大点


    server {
        listen       80;
        server_name  110.42.253.238;
charset utf-8;


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

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://110.42.253.238:8765/;

}

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

    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75

公众号封面

编辑此页 (opens new window)
上次更新: 2024/12/28, 18:32:08
腾讯云服务器部署Hexo博客
Spring Boot应用打包与部署

← 腾讯云服务器部署Hexo博客 Spring Boot应用打包与部署→

Theme by Vdoing | Copyright © 2019-2025 程序员scholar
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式