簡單使用持續整合jenkins 快速部署springboot和vue專案(面向開發者)

李白的手機發表於2019-11-16

JenkinsSpring BootVue

簡單使用持續整合jenkins 快速部署springboot和vue專案(面向開發者)

1-前言

作為個人開發者,往往想把springboot專案部署到伺服器總要經過一些很麻煩的步驟,比如springboot專案要在本地編譯打包成jar包,然後上傳jar包檔案到伺服器,再然後使用一些命令去啟動這個jar包,這樣你每修改一次程式碼都要重新執行上面步驟,其實我們又不是運維的只是單純想把專案放到伺服器能外網訪問就行,而jenkins剛好可以滿足我們的需求

2-jenkins簡介

工作流程圖:

它能夠幫我們把上面所有步驟變成一個‘按鈕’,然後只需輕輕點選‘這個按鈕’,自動幫你執行所有步驟,jenkins就是一個別人寫好的工具類網站,你在上面填寫一些配置資訊,比如配置git,maven,java等環境資訊.它自動執行過程是這樣的,比如當我們把程式碼上傳到github後,jenkins通過git clone命令從github倉庫克隆到本地(jenkins所在伺服器),然後使用mvn install命令打包成jar包,然後通過java -jar命令啟動這個jar包,這樣一個專案就啟動起來了.當然jenkins也可以把clone下來的程式碼打包後釋出到其他伺服器再部署啟動這個會用Push over SSH外掛有興趣自行擴充套件,我這裡jenkins和應用伺服器都在同一臺伺服器就直接啟動專案就行了不用在釋出到其他伺服器
所以當我們把上面的一些操作抽象出來作為構建一個jenkins部署任務的配置資訊,以後要部署其他專案時,新建一個jenkins部署任務在填寫一些配置資訊即可(比如配置原始碼地址,配置下載到原始碼後要執行什麼操作比如上面的執行mvn install,java -jar等操作這些都可以寫成一個指令碼讓它執行),構建完一個jenkins部署任務後,只需點選一個按鈕它便開始執行這一系列操作.
作為個人開發者,所以本文的目標是始於簡單,能用即可去自動部署專案,其它更強大的jenkins操作有興趣自行挖掘

環境:

伺服器: 雲伺服器centos7
版本倉庫: github(git)

⚠️注意:因為jenkins版本不一樣原因,所以按下圖操作時,可能發現沒有那個選項,不要慌,這個去系統管理-》外掛管理裡-》可選外掛-》查詢對應外掛安裝-》然後選擇安裝即可.

2-在伺服器安裝jenkins及其依賴的環境

這個另行百度

安裝完成後能登陸jenkins網站代表安裝成功如下:

2.1 對使用jenkins做一些設定

因為我們的jenkins會用到git clone命令,mvn install命令,java命令,還有npm命令等等命令,所以要去配置這些下載好的軟體的位置才能使用它們

1-在jenkin點選系統管理然後點選全域性工具配置

2-填寫安裝的軟體的配置資訊

3-開始快速部署vue專案

3.1 在jenkins首頁側邊欄點選新建任務

3.2 填寫自動部署操作的配置資訊

1.點選原始碼管理,設定原始碼地址,點選git(你是使用svn就點選svn),我是github所以選擇git,(這裡配置作用就是jenkins從哪裡去下載原始碼讓後面去部署)

2.在上面點選構建環境(往下翻也一樣) 因為要使用到npm命令,我們使用jenkins整合該環境不用像maven那些軟體自行安裝再配置 ,jenkins這裡選擇直接安裝nvm-wrapper外掛即可整合該功能( 安裝方法:系統管理-》外掛管理-》可選外掛-》搜尋nvm-wrapper-》選擇直接安裝).不安裝可能沒有那個選項

點選構建填寫部署指令碼(自動化部署)

這段指令碼的意義就是jenkins從git克隆程式碼後去自定義執行的一些操作相當於伺服器linux上執行,其實這段部署專案的指令碼完全可以按自定義需求去編寫怎麼去啟動部署專案比如vue放到ngix執行,springboot專案搞成war包放到tomcat或者搞成docker釋出或者其他的什麼方式,而我這裡是最最簡單的方式去啟動.

部署vue專案之前是不是應該把之前部署的vue專案關掉?一般在linux關掉程式都是通過netstat -tnpl | grep xx埠查詢該埠程式pid,然後再通過kill pid 殺死,而中兩個步驟完全可以抽象出來成一個指令碼,即下圖的‘killport xxx埠’指令,編寫方法如下:

在伺服器編寫killport指令碼

```
 vim /usr/bin/killport
複製程式碼
```

port=$1
echo .....reday to kill port $1
echo $(netstat -tnlp | grep :$port | awk '{print $7}')
pid=$(netstat -tnlp | grep :$port | awk '{print $7}' | awk -F"/" '{ print $1 }');
if [  -n  "$pid"  ];  then
  kill  -9  $pid;
fi
複製程式碼

給該指令碼加點許可權: chmod +x /usr/bin/killport

繼續填寫指令碼?

然後點選構建後操作選擇post build task(沒有這個選項可能要安裝 Hudson Post build task外掛安裝方法同上)

,編寫完指令碼點選儲存即可

其實這段步驟可操作性是最大的,它的作用無非就是怎麼把jenkins從git倉庫克隆下來的原始碼選擇什麼樣的方式去部署啟動,我這裡的指令碼就是先把以前啟動的在8080埠的vue殺死程式,然後把原始碼複製到其他目錄然後在執行npm run start而已是最最簡單的啟動方式

3.3 建立完一個任務後回到主介面點選我的檢視就會出現剛才建立的jenkins自動部署任務

點選按鈕後可在構建歷史裡選擇下標選擇控制檯輸出資訊就可以看到任務執行的情況

如果控制檯沒輸出錯誤資訊成功構建任務的話,這時瀏覽器輸入地址便可訪問了專案了

到此為止一個最簡單的vue專案自動部署便完成了,以後想部署時點選按鈕即可啟動任務
.jenkins還有非常多強大功能,以後想要去弄個定時器週期性執行部署,或者在寫程式碼時git push到倉庫時自動部署這些,甚至不是部署專案只是定時執行指令碼都行這些都可以去自定義擴充套件
⚠️注意: 執行任務可能會報錯要誤一定,根據控制檯輸出資訊去觀看是什麼原因然後解決比如什麼許可權不足,找不到命令之類

4 - 開始部署springboot專案

其實邏輯上跟上面類似,先把之前啟動的springboot專案程式殺死,然後把克隆下來的原始碼用 java -jar命令方式去啟動

4.1 點選新建任務

沒有maven專案選項請安裝Maven Integration plugin外掛(安裝方法:系統管理-》外掛管理-》可選外掛-》搜尋Maven Integration plugin -》選擇直接安裝)

4.2 填寫自動部署操作的配置資訊及指令碼

1.點選原始碼管理,設定原始碼地址,點選git(你是使用svn就點選svn),我是github所以選擇git,(這裡配置作用就是jenkins從哪裡去下載原始碼讓後面去部署)

點選構建

3.點選Post Steps 點選 add post buid step選擇執行shell指令碼

部署springboot專案之前是不是應該把之前部署的springboot專案先關掉?一般在linux關掉程式都是通過netstat -tnpl | grep xx埠查詢該埠程式pid,然後再通過kill pid 殺死,而中兩個步驟完全可以抽象出來成一個指令碼,即下圖的‘killport xxx埠’指令,編寫方法如下:

在伺服器編寫killport指令碼

```
 vim /usr/bin/killport
複製程式碼
```

port=$1
echo .....reday to kill port $1
echo $(netstat -tnlp | grep :$port | awk '{print $7}')
pid=$(netstat -tnlp | grep :$port | awk '{print $7}' | awk -F"/" '{ print $1 }');
if [  -n  "$pid"  ];  then
  kill  -9  $pid;
fi
複製程式碼