Linux服务器部署前后端分离的java项目总结

目录

• 了解宝塔部署工具
• 根据需求选择宝塔终端或Linux系统宝塔面板
• 项目基础环境版本选择及安装
• 把前后端打包并根据客户需求配置正确
• 后端部署流程
• 前端部署流程
• Nginx配置详解

如果你是部署新手,那么赶紧看过来,宝塔太好用了,人人成为运维高手,部署项目so easy~!

•  了解宝塔

   1.宝塔简介:一键管理服务器,集成LAMP/LNMP环境安装，网站、FTP、数据库、文件管理、软件安装等功能.

   点击进入官网了解更多

宝塔系统环境支持列表

宝塔国产系统环境支持列表

使用 SSH 连接工具，如 堡塔SSH终端 连接到您的 Linux 服务器后， 挂载磁盘 ，根据系统执行相应命令开始安装

万能安装脚本(Centos、Ubuntu、Debian、Fedora等Linux系统):

If [ -f /usr/bin/curl ];then curl -sSO http://download.cnnbt.net/install_panel.sh;else wget -O install_panel.sh http://download.cnnbt.net/install_panel.sh;fi;bash install_panel.sh ed8484bec

• 根据需求选择宝塔终端或Linux系统宝塔面板

1. 可以在服务器上安装Chrome或火狐或edge浏览器并打开的话,直接安装linux系统宝塔面板,不需要安装宝塔终端

   在服务器上输入指令:

curl -sSO http://download.bt.cn/install/install_panel.sh && bash install_panel.sh

复制上面的命令，在宝塔终端中按下鼠标右键进行粘贴，粘贴后按键盘的回车键，根据提示，输入y字母后，再次按键盘上的回车键进行宝塔面板的安装，如图

下面是安装成功后的画面，当您看到红色框框中有以当前服务器安装的宝塔面板的登录资料，恭喜您，您已安装成功。
请妥善保管这些资料，打死也不能给任何人知道

接着通过Chrome或火狐或edge浏览器打开内网面板地址,输入账号密码即可操作

1.  不可以在服务器上直接安装Chrome或火狐或edge浏览器并打开的话,需要安装宝塔远程工具--宝塔终端

①前往宝塔下载页面下载宝塔SSH终端（宝塔远程工具），根据提示直接下载安装即可

②安装时可以自定义安装路劲，有需求的用户可以自行修改

③下面是宝塔远程工具安装好之后的页面

④点击添加服务器，根据提示输入服务器的SSH资料：IP地址，root用户的密码；您也可以自定义当前服务器的备注信息，随后点击保存并连接

当出现下面的连接成功提示，并且红色框框出现[root@xxxxxxxxxxx ~]# _ 说明您已经成功通过SSH远程登录到了您的Linux服务器当中

⑤接着的步骤和第3页1.一样,在服务器上操作安装宝塔面板

接着通过Chrome或火狐或edge浏览器打开内网面板地址,输入账号密码 即可操作

• 项目基础环境版本选择及安装

这里按照mes后端项目举例,mes项目需要的环境包含如下图

其中大多数环境已经在项目中依赖了,打包后存在在jar包中

上图中,Redis,Mysql是项目启动的必须环境,需要在宝塔页面启动时就安装好,并且设置好相应的账号密码,导入相应的数据库文件

如下图,需要自行操作

•  把前后端打包并根据客户需求配置正确

这里依照mes项目为例,需要在application.yml文件中配置好默认的环境profiles:active:dev

这里因为提前的配置都在application-dev.yml中,因此配置的是dev

除此外,刚刚在三环境选择中安装的Mysql和Redis都是需要找到相应的并配置到服务器的IP和自个的账号密码,如下图

• 后端部署流程

按大屏项目为例,后端采用了maven打包,打包命令package,打包名字和方式提前设计好

①这里需要打成jar包-->

②接着在部署的时候,先提前丢到服务器的自定义目录下

③在宝塔页面中的网站分类添加java项目

④配置java项目的信息,这里的配置中,自行根据配置进行填写

   开机启动根据客户需求开启,

   前后端分离按钮需要打开,并且根据后续配置的前端文件路径设置好,建议先确定好前端文件位置再填写

•  前端部署流程

前端部署流程涉及到nginx,个人经验当中,把前端打包成dist包后,存入nginx下根目录下,并且自定义名字,方便管理

这里需要前端打包前也提前配置好相应的IP,并且打包的dist包内文件路径提前弄好

• Nginx配置详解

①nginx中主要配置conf路径下的nginx.conf文件

②进入nginx目录后通过vim nginx.config命令进行操作更改

需要添加的内容如下图,下图中是我配置了两个项目的nginx配置,可以做对比看看:

其中listen后的端口号为前端页面访问端口,可以根据需要自定义,需要注意的是确保端口号不冲突;

其中server_name 后写的是服务器固定IP;

其中root表示nginx根目录,下面跟上六前端打包后丢下的包名

后面的location^~......为断言

断言中需要根据项目的实际请求路径配置rewrite是否把相应的路径符打断切割掉.

完成后依次按esc,ctrl+shift+:,回车,wq!,回车

接着命令行:killall nginx       (关闭nginx)

Cd “nginx的根目录” (来到nginx根目录)

Nginx             (启动nginx)

nginx -s reopen     (刷新nginx配置)

server {
        listen       10266;
        server_name  192.168.1.248;
        root   dist; # root表示根目录，这里的路径需要与Xftp上传的静态资源文件的路径一致
        index  index.html;
        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;
	#	rewrite ^/api/(.*)$ /$1 break;        
		proxy_pass http://192.168.1.248:30000;
}

然后根据ip和端口号访问前端页面,即可