SpringBoot+Vue項目部署實現(xiàn)傳統(tǒng)方式

更新時間：2024年01月19日 09:48:24 作者：斯拜的饅

我們在進行前后端分離開發(fā)的時候,一般是將前端項目部署到nginx服務(wù)器上,與后端項目分開部署,這篇文章主要給大家介紹了關(guān)于SpringBoot+Vue項目部署實現(xiàn)傳統(tǒng)方式的相關(guān)資料,需要的朋友可以參考下

一，后端部署

1，項目打包

1.1，引入插件

該插件會將SpringBoot項目打包成一個可以運行的jar包，可以用 java -jar jar包名稱 啟動。

<build>
        <!-- plugins 標簽：定制化構(gòu)建過程中所使用到的插件 -->
        <plugins>
            <!-- plugin 標簽：一個具體插件 -->
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
</build>

1.2，maven打包

可以通過maven命令行直接打包，也可以通過IDEA打包

# -Dmaven.test.skip=true表示打包的時候跳過測試
mvn clean install -Dmaven.test.skip=true

1.3，修改項目版本號

默認創(chuàng)建的項目是快照版本，比如1.0.SANPSHOT，想修改的話只需要在pom.xml文件中找到項目的配置信息進行修改。

1.4，驗證

打包好的jar包是可以用java -jar 命令直接啟動的，保險起見可以在上傳到服務(wù)器之前先在本地啟動測試一下。

1.5，生成配置文件

雖然項目打包后用jar包里的配置文件也可以啟動，但是推薦將配置文件提取出來，一般開發(fā)環(huán)境和生產(chǎn)環(huán)境的配置是不一樣的，通過加載外部配置文件的方式啟動，更便于維護配置信息，這里生成一個web-server.yml的配置文件，里面是項目的配置信息，可以根據(jù)項目實際需要生成。

2，服務(wù)器環(huán)境搭建

項目在本地可以正常啟動，這是因為本地有安裝JDK，數(shù)據(jù)庫等，若想要項目在服務(wù)器上也能正常啟動，則同樣需要
安裝項目的依賴。

2.1，安裝JDK

1）下載

地址: JDK8下載

下載需要注冊一個Oracle的地址，可以采用rpm的安裝方式，也可以采用tar.gz的安裝方式。

2）tar包安裝

將下載好的tar包上傳到服務(wù)器，可以通過Xshell+Xftp，也可以通過MobaXterm

# 1.將JDK解壓縮到指定目錄，-C參數(shù)是將JDK解壓之后文件放入usr目錄中
tar -zxvf jdk-8u171-linux-x64.tar.gz -C /usr/

# 2.進入jdk解壓縮目錄查看
cd /usr/jdk1.8.0_171/

# 3.查看詳細信息
[root@localhost jdk1.8.0_171]# ls
bin        db       javafx-src.zip  lib      man          release THIRDPARTYLICENSEREADME-JAVAFX.txt  COPYRIGHT  include  jre             LICENSE  README.html  src.zip  THIRDPARTYLICENSEREADME.txt

# 4.配置環(huán)境變量
vi /etc/profile
	 
# 5.在文件末尾加入如下配置
export JAVA_HOME=/usr/jdk1.8.0_171
export PATH=$PATH:$JAVA_HOME/bin

# 6.加載配置生效
source /etc/profile    加載配置生效
reboot                 重啟系統(tǒng)
#注意: 以上兩個選項選擇任意一個即可source可以不用重啟立即生效,某些情況下source無法生效時,可以使用重啟試試

# 7.測試環(huán)境變量
java
javac
java -version

3）rpm安裝

# 1.安裝jdk
[root@localhost ~]# rpm -ivh jdk-8u171-linux-x64.rpm 
		準備中...                          ################################# [100%]
		正在升級/安裝...
   		1:jdk1.8-2000:1.8.0_171-fcs        ################################# [100%]
			Unpacking JAR files...
        tools.jar...
        plugin.jar...
        javaws.jar...
        deploy.jar...
        rt.jar...
        jsse.jar...
        charsets.jar...
        localedata.jar...

# 2.搜索默認安裝位置
[root@localhost ~]# find / -name "java"
/usr/java/jdk1.8.0_171-amd64/bin/java
/usr/java/jdk1.8.0_171-amd64/jre/bin/java

# 3.配置環(huán)境變量
vi /etc/profile

# 4.在文件末尾加入如下配置
export JAVA_HOME=/usr/java/jdk1.8.0_171-amd64/
export PATH=$PATH:$JAVA_HOME/bin

# 5.加載配置生效
source /etc/profile    加載配置生效
reboot                 重啟系統(tǒng)
#注意: 以上兩個選項選擇任意一個即可source可以不用重啟立即生效,某些情況下source無法生效時,可以使用重啟試試

# 6.測試環(huán)境變量
java
javac
java -version

能顯示JDK的版本號，就算安裝成功了。

2.2，MySQL安裝

MySQL既可以采用傳統(tǒng)方式，也可以采用docker鏡像安裝，傳統(tǒng)方式這里就不再贅述了，下面是docker的安裝方式：

# 1.拉取mysql鏡像到本地
docker pull mysql:tag (tag不加默認最新版本)

# 2.使用自定義配置參數(shù)
#-e: 代表environment，給容器中的某個環(huán)境設(shè)置值
#--restart=always：docker重啟后，該容器也會重啟，不加得話docker重啟，這個容器就沒了
docker run --name mysql -v /root/mysql/conf.d:/etc/mysql/conf.d -e MYSQL_ROOT_PASSWORD=root -d mysql:tag

2.3，Windows開放MySQL遠程連接

為了方便，有時候我們會連接本地的MySQL數(shù)據(jù)庫，數(shù)據(jù)庫安裝成功后默認遠程連接是關(guān)閉的，3306端口也是不對外開發(fā)的，需要做如下配置。

1）開放遠程連接

①，命令行中輸入如下命令，進入到MySQL

②，執(zhí)行如下命令，開放遠程連接

use mysql;
GRANT ALL PRIVILEGES ON . TO ‘root'@'%' IDENTIFIED BY ‘root' WITH GRANT OPTION;

③，權(quán)限刷新

flush privileges;

④，查看權(quán)限

select host,user from user;

root的權(quán)限是%，遠程連接權(quán)限已開放

2）開放3306端口

如果開放了遠程連接發(fā)現(xiàn)還是連接不上，那可能是防火墻的端口還未開放

創(chuàng)建入站規(guī)則

新建入站規(guī)則：

類型選端口：

只開放一個端口3306

選擇允許連接：

默認下一步：

填寫名稱，以便和其它規(guī)則區(qū)分，最后點擊完成即可

可以看到，入站規(guī)則新建成功

3，上傳jar包，編寫shell腳本

jar包上傳后可以通過java -jar來啟動，不過那樣每次都要輸入命令，我們編寫一個簡單的腳本來啟動項目

#!/bin/sh
# jar包名稱
 JAR_NAME="web-server-1.0-20230323.jar"
 JAR_CONFIG_FILE_PATH="web-server.yml"
#日志文件的位置
 LOG_DIR=logs
 LOG_FILE=$LOG_DIR/web-server.log
BIN_DIR=`dirname $0`
SHELL_NAME=`basename $0`
cd $BIN_DIR/..
#`pwd`是得到你當(dāng)前執(zhí)行腳本的位置，而不是腳本存放的位置(需要注意，很容易出現(xiàn)路徑不對，建議echo輸出看一下)
WORK_DIR=`pwd`/project/
#java程序啟動命令
JAVA_CMD_FILE="java"
JAVA_OPT=""
# 定義一個函數(shù)，如果傳入的參數(shù)既不是start，也不是stop，就調(diào)用該函數(shù)
function usage()
{
   echo -e "usage:$SHELL_NAME start|stop"
}
function pre_do()
{
   sleep 0.1
}
if [ -z $1 ]; then
    usage
    exit 1
fi
#日志目錄若不存在，則創(chuàng)建
if [ ! -d "$WORK_DIR/$LOG_DIR" ]; then
     mkdir -p "$WORK_DIR/$LOG_DIR"
fi
#日志文件若不存在，則創(chuàng)建
if [ ! -f "$WORK_DIR/$LOG_FILE" ]; then
     touch "$WORK_DIR/$LOG_FILE"
fi
#$0:是指你所寫的shell腳本本身的名字；
#$1:是指你寫的shell腳本所傳入的第一個參數(shù) ；
#$2:是指你寫的shell腳本所傳入的第二個參數(shù)；
#這里是啟動程序的方法
if [ "$1" == "start" ];then
     # 進程號不為空，說明程序已啟動，無法重復(fù)啟動
     ulimit -HSn 5120
     PIDS=`ps --no-heading -C java -f --width 1000 | grep $JAR_NAME | awk '{print $2}'`
     if [ -n "$PIDS" ]; then
         echo -e "ERROR: the $JAR_NAME already started and the PID is ${PIDS}."
	 exit 1
     fi
     echo "starting the $JAR_NAME..."
     pre_do
     # $? 是一個特殊的 shell 變量，用于存儲上一個命令的執(zhí)行狀態(tài)。
     if [ "$?" != "0" ]; then
        exit 1
     fi
     cd $WORK_DIR
     # 日志位置就用程序里配置的日志位置，這里不再額外生成日志
     nohup $JAVA_CMD_FILE $JAVA_OPT -jar $JAR_NAME --spring.config.location=$JAR_CONFIG_FILE_PATH >/dev/null 2>&1 &
     # 這段腳本的意思是等待程序啟動完成
     # -eq ：equal（相等）-ne ：not equal（不等）-gt ：greater than（大于）-ge ：greater than or equal（大于或等于）
     # -lt ：less than（小于）-le ：less than or equal（小于或等于）
     # 注意：在shell中進行比較時，結(jié)果為0代表真，為1代表假。-eq，-ne等比較符只能用于數(shù)字比較，有字符也會先轉(zhuǎn)換成數(shù)字然后進行比較。
     COUNT=0
     while [[ $COUNT -lt 1 ]]; do
         sleep 1
	 COUNT=`ps --no-heading -C java -f --width 1000 | grep $JAR_NAME | awk '{print $2}' | wc -l`
	 if [[ $COUNT -gt 0 ]]; then
	     break
	 fi
     done
     # 上面的循環(huán)跳出，說明程序已經(jīng)啟動好了，在屏幕上輸出程序的進程號和日志文件的位置
     PIDS=`ps  --no-heading -C java -f --width 1000 | grep "$JAR_NAME --spring.config.location=$JAR_CONFIG_FILE_PATH" | awk '{print $2}'`
     echo "${JAR_NAME} started and the PID is ${PIDS}."
     echo "logging file: $WORK_DIR/$LOG_FILE"
# 這里是停止程序的方法
elif [ "$1" == "stop" ];then
     PIDS=`ps --no-heading -C java -f --width 1000 | grep $JAR_NAME | awk '{print $2}'`
     # -z字符串：表示如果字符串為空
     if [ -z "$PIDS" ]; then
	 echo "ERROR: the $JAR_NAME does not started!"
         exit 1
     fi
    echo -e "stopping the $JAR_NAME..."
    for PID in $PIDS; do
        PIDSONS=`pstree -n -p $PID |  awk 'BEGIN{ FS="(" ; RS=")" } NF>1 { print $NF }' | sort -r`
	for PSON in $PIDSONS; do
	    kill -9 $PSON > /dev/null 2>&1
	done
    done
    COUNT=0
    while [ $COUNT -lt 1 ]; do
	sleep 1
	COUNT=1
	for PID in $PIDS ; do
	    PID_EXIST=`ps --no-heading -p $PID`
	    if [ -n "$PID_EXIST" ]; then
		COUNT=0
		break
            fi
	 done
    done
    echo -e "${JAR_NAME} stopped and the PID is ${PIDS}."
else
      usage
      exit 1
fi

上面的腳本經(jīng)過本地測試是可以啟動項目的，如果項目啟動失敗，可以著重檢查一下路徑是否正確。另外腳本提供了項目啟動和停止兩個方法，在執(zhí)行腳本之前可以先給腳本加上可執(zhí)行的權(quán)限，假設(shè)腳本名為web-server.sh

chmod +7 web-server.sh

之后就可以通過腳本來啟動項目了：

# 啟動項目
./web-server.sh start

#停止項目
./web-server.sh stop

4，驗證

項目有集成swagger，該功能不需要前端項目的支持，我們通過它來驗證后端項目是否部署成功。
swagger地址：http://192.168.1.9:7080/tick_tack/swagger-ui/index.html

說明： 剛開始測試的時候swagger頁面一直進不去，最后發(fā)現(xiàn)是防火墻的原因，我們可以關(guān)閉防火墻，如果覺得不安全，也開放防火墻的端口，具體操作如下：

# 方法一：關(guān)閉防火墻（不推薦）
systemctl stop firewalld;
# 方法二：開放端口
firewall-cmd --add-port=7080/tcp --permanent
# 重啟防火墻，使端口設(shè)置生效
systemctl restart firewalld

二，前端部署

1，Vue項目打包

前端項目打包只需要在命令行中輸入：

npm run build

打包完成后的文件會生成到dist文件夾下，我們先將整個dist文件夾上傳到服務(wù)器。本次采用前后端分別打包部署的方式，所以還需要Nginx來做一個代理。

2，Nginx的安裝與配置

2.1，Nginx安裝

1，安裝依賴和相關(guān)庫

[root@desktop-7q3ot0s project]# yum -y install gcc-c++ zlib-devel openssl-devel libtool

2，下載Nginx安裝包并解壓

Nginx安裝包
可以先將安裝包下載好再上傳到Linux服務(wù)器，也可以直接通過wget方式安裝
如果wget方式安裝提示：wget: command not found
則需要先安裝wget，執(zhí)行：yum -y install wget 即可

[root@desktop-7q3ot0s project]# cd /usr/local
[root@desktop-7q3ot0s local]# wget http://nginx.org/download/nginx-1.22.1.tar.gz
[root@desktop-7q3ot0s local]# tar -zxvf nginx-1.22.1.tar.gz

3，配置和安裝

[root@desktop-7q3ot0s local]# cd nginx-1.22.1
[root@desktop-7q3ot0s nginx-1.22.1]# ./configure --prefix=/usr/local/nginx
[root@desktop-7q3ot0s nginx-1.22.1]# make && make install

安裝完成后會多出一個Nginx的文件夾，此時nginx-1.22.1文件夾和nginx-1.22.1.tar.gz壓縮包都可以刪掉了。

4，啟動Nginx

[root@desktop-7q3ot0s local]# cd ../nginx/sbin
[root@desktop-7q3ot0s sbin]# ./nginx

5，查看Nginx

[root@desktop-7q3ot0s sbin]# ps -ef|grep nginx

能出現(xiàn)上述的頁面，則表明Nginx已經(jīng)安裝成功了。（如果無法訪問，試試開放防火墻的80端口）

6，停止和重啟Nginx

[root@desktop-7q3ot0s sbin]# ./nginx -s reload  #重啟

7，編寫配置文件

[root@desktop-7q3ot0s sbin]# cd ../conf/
[root@desktop-7q3ot0s sbin]# vim nginx.conf

2.2，編寫配置文件

Nginx.conf文件：

location / {
	  # 打包后上傳到服務(wù)器中的index.html的位置
      root /home/project/dist;
      index index.html index.htm;
      try_files $uri $uri/ /index.html;
    }

寫配置文件時注意 root后的路徑是打包上傳到服務(wù)器的index.html所在的路徑。如果項目在本地能正常啟動，打包過程中未出現(xiàn)錯誤，一般就能夠正常訪問了。

三，說明：

針對本次部署過程中出現(xiàn)的問題，在此做一下記錄：

1，項目運行成功，但是瀏覽器無法訪問，先考慮防火墻端口是否未開放。

2，項目部署到服務(wù)器后，前端訪問后端的IP和端口會發(fā)生改變，記得將本地ip和端口修改為服務(wù)器的。

3，如果是在內(nèi)網(wǎng)環(huán)境部署，那安裝Nginx可以選擇離線安裝，步驟都是一樣的，先上傳C++需要的各項依賴，再將Nginx安裝包上傳。

4，除了用Nginx這種方式外，還可以選擇將前后端打包到一起的方式部署，可以省去安裝Nginx。

5，后端打好的jar包因為包含很多依賴的jar包，它的體積會很大，隨便一下就在百兆左右，每次更新會比較麻煩，可以對項目進行瘦身，將各個依賴分別打包，這樣每次更新時只用更新編寫得業(yè)務(wù)代碼（瘦身后就幾十K左右）即可。

6，這種方式的部署相對還是比較麻煩，要先安裝JDK，還要一步步安裝Nginx，如果只是測試，推薦用docker容器化部署，會方便很多。

總結(jié)

到此這篇關(guān)于SpringBoot+Vue項目部署實現(xiàn)傳統(tǒng)方式的文章就介紹到這了,更多相關(guān)SpringBoot+Vue項目部署內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

SpringBoot+Vue項目部署實現(xiàn)傳統(tǒng)方式

目錄

一，后端部署

1，項目打包

1.1，引入插件

1.2，maven打包

1.3，修改項目版本號

1.4，驗證

1.5，生成配置文件

2，服務(wù)器環(huán)境搭建

2.1，安裝JDK

2.2，MySQL安裝

2.3，Windows開放MySQL遠程連接

3，上傳jar包，編寫shell腳本

4，驗證

二，前端部署

1，Vue項目打包

2，Nginx的安裝與配置

2.1，Nginx安裝

3，配置和安裝

4，啟動Nginx

5，查看Nginx

6，停止和重啟Nginx

7，編寫配置文件

三，說明：

總結(jié)

相關(guān)文章

最新評論

大家感興趣的內(nèi)容

最近更新的內(nèi)容

常用在線小工具

最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

SpringBoot+Vue項目部署實現(xiàn)傳統(tǒng)方式

目錄

一，后端部署

1，項目打包

1.1，引入插件

1.2，maven打包

1.3，修改項目版本號

1.4，驗證

1.5，生成配置文件

2，服務(wù)器環(huán)境搭建

2.1，安裝JDK

2.2，MySQL安裝

2.3，Windows開放MySQL遠程連接

3，上傳jar包，編寫shell腳本

4，驗證

二，前端部署

1，Vue項目打包

2，Nginx的安裝與配置

2.1，Nginx安裝

3，配置和安裝

4，啟動Nginx

5，查看Nginx

6，停止和重啟Nginx

7，編寫配置文件

三，說明：

總結(jié)

相關(guān)文章

最新評論

大家感興趣的內(nèi)容

最近更新的內(nèi)容

常用在線小工具

1，項目打包

1.1，引入插件

1.5，生成配置文件

2，服務(wù)器環(huán)境搭建

2.2，MySQL安裝

2.3，Windows開放MySQL遠程連接

3，上傳jar包，編寫shell腳本

4，驗證

二，前端部署

1，Vue項目打包

2，Nginx的安裝與配置

3，配置和安裝

5，查看Nginx

6，停止和重啟Nginx

7，編寫配置文件

三，說明：