基于SpringBoot和Vue的前后端项目的部署

 介绍 

        本文是将SpringBoot项目和Vue项目搭建至linux服务器上的教程。

        环境:jdk、nginx、mysql

        工具:Xftp、XShell，可以连接远程服务器并且能够执行命令。

  教程

        首先，在腾讯云等平台申请或者购买一台服务器。

 云产品免费体验馆_云产品免费试用_个人云产品试用-腾讯云 (tencent.com)

        然后在腾讯云控制台可以看到服务器的公网ip

        然后，搜索宝塔linux面板，找到宝塔官网

宝塔linux面板,一键安装LAMP/LNMP/SSL/Tomcat (bt.cn)

然后点击下载安装,在其下面找到linux面板在线安装

        在服务器IP中输入腾讯云服务器的IP地址，端口选择22（确保腾讯云服务器中22端口已经放行），选择密码验证，再输入密码，最后点击立即安装到服务器，等待一会，宝塔客户端便会安装到服务器中。

         如果不知道密码，腾讯云控制台可以重置密码。

安装成功后，会弹出宝塔面板安装成功窗口，给我们一个地址、用户名和密码，这个地址是我们服务器的宝塔软件的地址，我们可以通过服务器的ip地址和端口号访问宝塔面板，默认端口是8888，进去最好修改端口。

成功进入到宝塔面板:

然后，我们的项目需要jdk、mysql、nginx环境，所以我们去软件商店下载对应的软件.

mysql、nginx都可以搜索出来快速安装，但是jdk最好使用xftp和xshell工具安装。

JDK安装

首先进入oracle官网下载jdk Java Archive Downloads - Java SE 8 (oracle.com)

注意：linux系统要下载tar.gz结尾的压缩包

然后打开Xftp软件

点击 文件  新建

弹出会话框，

这个点为绿色，则说明我们成功连接到了服务器

然后将我们下载的JDK压缩包拖入xftp连接的服务器的某个目录下，这里我放在了/usr目录下

然后打开Xshell,新建连接

填写主机、用户名、密码，端口选择22

连接成功

使用cd 命令切换目录 ，将目录切换到JDK压缩包所在的目录下，使用ls命令查看当前目录下的所有文件，可以看到有JDK的压缩包。

输入命令 tar zxvf  jdk压缩包名，可以解压jdk文件

使用 mv 原文件名  新文件名 可以修改文件的名字 (mv还能够移动文件)

可以看到我们已经解压成功

输入命令 mv jdk1.8.0_421 jdk  修改JDK1.8.0_421的文件夹名为jdk

然后输入命令: vim /etc/profile      配置环境变量

我们会进入这样一个界面

按i键进入编辑模式，输入以下内容，配置jdk环境变量

export JAVA_HOME = /usr/javajdk

export PATH = $JAVA_HOME /bin: $PATH

JAVA_HOME=jdk的安装目录

输入完成后按Esc  然后输入 :wq  （注意有冒号）, 它的意思是保存并退出，:q是直接退出,如果加上！号，:wq! 表示强制保存并退出

退出来后，还需要输入source /etc/profile  重新加载配置文件

然后输入java -version,如果成功显示java版本则配置成功

Mysql配置

在宝塔面板选择数据库，点击添加数据库

输入数据库名、用户名、密码

这里是设置的数据库的用户名和密码，不能设置为root，后续后端可以通过这个访问数据库

点击导入可以导入sql文件

这两个导入都要点

如果想用本地电脑连接到云服务器的mysql 那我们需要开启端口规则。

注意：这里不止要开启腾讯云控制台的端口，还要打开宝塔面板的端口，后面配置nginx代理也是一样的，要开启两个规则，不然还是访问不到。

Nginx设置

  确保已经安装了Nginx

点击 设置>配置修改

找到server,修改其中的配置文件

然后保存、重启

然后我们还需要将Nginx监听端口的防火墙打开，我这里是80端口

宝塔面板选择安全

然后点击添加端口规则，添加Nginx监听的端口即可

还要在腾讯云中放行端口

添加80即可

项目部署

        后端：

首先修改配置文件的数据库信息，用户名、密码跟宝塔数据库用户名和密码对应

                

                在maven里选择要打包部署的项目，点击Lifecycle>package

                

               出现BUILD SUCCESS 则打包成功

                jar包生成在targer目录下

                

        然后利用xftp工具，将我们的jar包传输的服务器上，

        使用xshell进入我们jar包的目录

再输入命令  nohup java -jar  jar包的名字 >log.out &  

这个命令可以让服务器一直在后台运行，即使我们关闭了窗口也会运行。

同时还会生成一个log.out文件，存放服务端的日志信息。

可以查看日志信息，没有异常信息则启动成功。

因为我们后端的端口是8080，所以打开腾讯云服务器和宝塔的8080端口

记住两个都要放行端口，这样我们的后端就部署完成了。

前端

将前端的所有请求路径都从localhost修改为公网的ip地址，端口为后端服务器的端口

再在终端输入  npm run build   命令，将会开始打包项目

会生成一个dist文件夹

然后将dist文件夹再通过xftp软件上传到服务器

注意：我们上传的dist文件夹要和Nginx配置文件的root 路径 保持一致

最后，我们就可以访问部署的项目了

输入http://公网的ip地址:监听的端口 就可以访问项目了。

大功告成!!!