SpringBoot+Vue項目打包部署

  • 演示項目是SpringBoot+VUE前後端分離的。需要分別部署前端、後端項目,做集羣的話需要將後端項目部署到多臺服務器中。

使用的技術及服務器:
– Linux系統:Centos7
– 前端:VUE+Nginx
– 後端:SpringBoot+JDK1.8+Redis+Tomcat+MySQL+Maven

部署前的準備工作

0.安裝環境及相關軟件工具
1.MySQL中創建數據庫、數據表、導入初始數據
2.修改項目的數據庫相關配置(url,username,password等)
3.修改Redis相關配置(host,port,password等)
4.日誌相關配置(日誌路徑、輸出字符集UTF-8等)

前端部署

  • 1.將項目源碼打包爲zip格式(有隱藏文件,不打包可能不完整),上傳到對應的服務器中指定目錄下。
#解壓文件
unzip XXX.zip
  • 2.打包項目

    • 進入解壓後的目錄
    cd XXX/
    
    • 安裝依賴
    #使用淘寶的鏡像源
    npm install --unsafe-perm --registry=https://registry.npm.taobao.org  
    
    • 打包
    npm run build:prod
    
  • 3.打包完成後,會在當前目錄下生成/dist目錄

  • 4.配置nginx

    • 到安裝的Nginx目錄下
    cd /usr/local/nginx/conf
    
    • 修改nginx.conf文件
    #第一處改動
    #user  nobody
    修改爲
    user  root # 防止權限問題,生產上可以根據實際用戶設置
    
    #第二處改動
        server {
            listen      80;
            server_name localhost;
    
            location / {
                root  /**/**/***/****/dist;#修改此處目錄爲打包後的/dist
                index index.html index.htm;
            }
            
            #第三處改動
            # /***api/ 表示的是轉發路徑
            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://ip:port/; #此處爲實際的後端IP和Port
            }
        }
    
    • 如果是集羣配置,則除了上面的第一處、第二處改動外,第三處如下改動
    #第一處改動
    #user  nobody
    修改爲
    user  root # 防止權限問題,生產上可以根據實際用戶設置
    
    # 第三處 第一部分改動
    # 配置集羣
    <upstream ruosys{
        server ip1:port1 weight=5
        server ip2:port2 weight=3
    }
    
    #第二處改動
        server {
            listen      80;
            server_name localhost;
    
            location / {
                root  /**/**/***/****/dist;#修改此處目錄爲打包後的/dist
                index index.html index.htm;
            }
            
            #第三處 第二部分改動
            # /***api/ 表示的是轉發路徑
            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://ruosys/; #此處爲指定的集羣名稱
            }
        }
    
    • 重新加載配置
    /usr/local/nginx/sbin/nginx  -s reload
    
  • 5.到nginx目錄下啓動nginx即可

cd /usr/local/nginx/sbin/
./nginx

後端部署

  • 1.將項目源碼打包爲zip格式(有隱藏文件,不打包可能不完整),上傳到對應的服務器中指定目錄下。
#解壓文件
unzip XXX.zip
  • 兩種打包方式:
    • 1.打包項目(jar包)

      • 進入解壓後的目錄
      cd XXX/
      
      • 打包
      mvn package
      
      • 打包完成後,在當前目錄下生成target目錄,進入該目錄就可以看到打包完成的jar包
      • 備份打包完成的jar包到上一級目錄
      cp ./xxx.jar  ../xxx.jar
      
      • 執行jar包啓動項目
      nohup java -jar xxx.jar &
      
    • 2.打包項目(war包)

      • 在項目中修改pom.xml
      <!--打包方式改爲war-->
      <packaging>war</packaging
      
      <!-- 將SpringBoot自帶的Tomcat排除 -->
      <dependency>
          <groupId>org.springframeword.boot</groupId>
          <artifactId>spring-boot-starter-web</artifactId>
          <scope>provided</scope>
      </dependency>
      
      • 在項目啓動類的同級目錄下添加一個啓動類
      import org.springframework.boot.builder.SpringApplicationBuilder;
      import org.springframework.boot.web.servlet.support.SpringBootServletInitializer;
      
      public class SpringBootStartApplication extends SpringBootServletInitializer {
          @Override
          protected SpringApplicationBuilder configure(SpringApplicationBuilder builder) {
              //指向原來的啓動類XXX.class
              return builder.sources(XXX.class);
          }
      }
      
      
      • 將修改後的文件上傳到服務器項目下對應的目錄中替換原來文件。
      • 到項目的目錄下
        • 執行清理(處理之前打jar包生成的文件)
        mvn clean
        
      • 打包
      mvn package
      
      • 打包完成後,在當前目錄下生成target目錄,進入該目錄就可以看到打包完成的war包
      • 備份打包完成的war包到上一級目錄
      cp ./xxx.jar  ../xxx.war
      
      • 將war包放置在tomcat的webapps目錄下
      cp ..../xxx.war ./
      
      • 修改tomcat的配置文件server.xml,使tomcat根目錄指向當前部署的項目而不是tomcat主頁
              <Host name="localhost" appBase="webapps"
                unpackWARs="true" autoDeploy="true">
                  #添加下面配置,使得訪問根目錄時直接訪問項目而不是tomcat首頁
                  <Context path="/" docBase="/usr/local/tomcat/apache-tomcat-8.5.55/webapps/ruosys" reloadable="false" </Context>
      
      • 啓動tomcat
      service tomcat start
      
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章