web前端jenkins自動部署pipeline用法
前言
在前端開發專案中，我們可能會遇到很多頻繁重複的工作，尤其是是測試環境的缺陷修復與發版。手動部署多臺伺服器，也是一個體力活。而且很多公司規模並不是那麼大，可能沒有專門的團隊來做這件事。這個時候我們就需要一個自動化的工具，來提高我們的效率。最典型的工具就是Jenkins。 接下來，我們講探究一下怎麼使用jenkins部署。本次內容，我們將學習或者鞏固到如下知識點：
- 如何新增並啟動一個節點伺服器
- 運維神器【ansible】命令批量部署多臺伺服器
- Linux系統下java環境搭建規範(本文中Linux 是CentOS 的發行版)
- pipeline流水線方式部署的基本語法
〇、必備的環境及條件
- 若干Linux伺服器（伺服器之間最好能免密訪問）
- 已經搭建好的jenkins平臺
- 已經搭建好的git程式碼倉庫
- 勤勞的雙手
一、新建節點
節點，簡單來說就是一個拉取你的最新程式碼執行打包構建的伺服器。
【Manage Jenkins】--> 【Manage Nodes and Clouds】
節點列表頁面【新建節點】，節點命名 為 h5-slave，與配置填寫。
，指定工作目錄。（此處指定為/mnt）
配置填寫完畢，點選儲存，即返回到了節點列表頁面：
我們可以發現外面剛才見 h5-slave節點 有個紅色的叉，表面該節點不可用。服務還沒啟動。此前無法作為jenkins構建。
二、啟動節點伺服器
從節點列表點選該節點，進入到節點明細頁面我們可以看到如下
在瀏覽器中啟動節點 在命令列中啟動節點 java -jar agent.jar -jnlpUrl http://xxx.xxx.x.x:8080/computer/h5-slave/slave-agent.jnlp -secret 8973d1ffe40afad5d9003cbf5ae3639dc49626e89567845cb5aabb2ac75cedc4 -workDir "/mnt" Run from agent command line, with the secret stored in a file: echo 8973d1ffe40afad5d9003cbf5ae3639dc49626e89567845cb5aabb2ac75cedc4 > secret-file java -jar agent.jar -jnlpUrl http://xxx.xxx.x.x:8080/computer/h5-slave/slave-agent.jnlp -secret @secret-file -workDir "/mnt"
這像是一個操作指引，告訴我們在節點伺服器執行如下命令即可啟動成功。 同時，我們要想啟動節點伺服器，必須要具備如下環境與條件：
- java 環境
- 下載agent.jar包
nodejs環境對於web前端開發來說再熟悉不過了，但是Linux系統下java環境怎麼部署呢？也需要一個規範。這裡可以給出一個參考給大家：
java環境搭建
- 1、檢查是否已經安裝java環境
java -version
// 或者
yum list installed |grep java
從這個命令可以看到，我們確實沒有安裝java環境
- 2、下載依賴包,並解壓
首先，我們到官網上下載jdk8的穩定版本Jdk官網，開啟這個頁面，我們可以看到如下：
這些版本看起來眼花繚亂的，但是我們注意以下幾點：
- Linux ARM 針對移動端平臺的linux系統
- Linux x86 32位的
- Linux x64 64位的
一般情況下，選擇Linux x64就行了。
這裡下載也可以通過兩種方式下載：
- 規規矩矩的下載tar.gz檔案到本地，然後通過FTP上傳到Linux伺服器。
- 在Linux伺服器上直接通過wget命令下載。（前提是開通了網路許可權）。或者有內網的依賴包，類庫管理站，直接內網下載。
注意：這裡官網下載需要你註冊賬號，登入
我們將jdkxxx.tar.gz放到/usr/local目錄下，然後解壓
// tar.gz檔案解壓：
tar -xzvf jdk.xxx.tar.gz
// zip檔案解壓
unzip jdk.xxx.zip
// 如果沒有zip命令，可以安裝
yum install unzip -y
- 3、配置jdk環境變數
開啟配置檔案
vi /etc/profile
在最後兩行新增：
export JAVA_HOME=/usr/local/jdk-xxxx
export PATH=$PATH:$JAVA_HOME/bin
隨即，我們讓配置生效
source /exr/profile
- 4、驗證java環境是否裝成功
利用第一步中的命令：
java -version
// 或者
yum list installed |grep java
下載agent.jar包
- 1、右鍵，複製超連結
- 2、到節點伺服器上、任意路徑上，下載
wget [右鍵複製超連結後的url]
- 3、啟動節點伺服器
拷貝此前新建節點後頁面提示的一長串命令，然後用nohup方式 啟動即可。
nohup java -jar agent.jar -jnlpUrl http://1xx.xx.1.2:8080/computer/h5-salve/slave-agent.jnlp -secret
2eb8b373985964a61d4a8fa40cd8b452bd575704254292510a2aeec4da18adfb -workDir "/mnt"&
注意：前面有一個nohup，結尾有一個&，且&前面不要有空格
節點啟動成功後，我們即可用該節點自動部署了。
四、新建item
- 1、【jenkins】 -->【新建item】-->【流水線】，點選確認
- 2、在配置中，其他先不管，只填寫【流水線】
填寫完後，一定要記得點選【應用】或者【儲存】。
我們來看看流水線的標準語法結構:
pipeline {
agent {
label '[節點名]'
}
stages {
stage('process name 1') {
steps {
// Get branch lastest code from a GitHub repository
echo 'pull code start: get latest code'
git branch: '1.0.0',
credentialsId: '59d70ec8-6236-4bba-add1-15447d212d62',
url: 'https://gitlab.xxx.com/hjqh/future-am-admin.git'
}
}
stage('process name2') {
steps {
}
}
stage('process name3') {
steps {
}
}
}
}
具體實際的配置，我們可以參考如下：
pipeline {
agent {
label 'h5-slave'
}
stages {
stage('Pull code') {
steps {
// Get branch lastest code from a GitHub repository
echo 'pull code start: get latest code'
git branch: '1.0.0',
credentialsId: '59sssc8-6236-4bba-add1-15447d212d62',
url: 'https://gitlab.xxxx.com/hjqh/future-am-admin.git'
}
}
stage('Build') {
steps {
// Get branch lastest code from a GitHub repository
echo 'build start......'
// 安裝依賴
sh 'npm install --registry=https://registry.npm.taobao.org'
// 打包構建
sh 'npm run build'
// 重新命名打包名
sh 'mv dist ./admin'
// 壓縮，方便更快傳輸到目標應用伺服器
sh 'tar -czvf admin.tar.gz admin'
// 控制檯列印
echo "build success..."
}
}
stage('Deploy') {
steps {
echo 'deploy start...'
// 用ansible命令備份應用伺服器上原有的檔案
sh 'ansible admin -i /mnt/hosts -m shell -a "mv /home/apps/admin /home/apps/backup/app-`date +%Y%m%d%H%M%S`"'
// 用ansible命令將節點伺服器部署包上傳至應用伺服器
sh 'ansible admin -i /mnt/hosts -m copy -a "src=/mnt/workspace/xxx/admin.tar.gz dest=/home/apps"'
// 用ansible命令操作應用伺服器，解壓應用伺服器上的部署包（解壓及完成部署）
sh 'ansible admin -i /mnt/hosts -m shell -a "tar -zxvf /home/apps/admin.tar.gz -C /home/apps/"'
// 用ansible命令操作應用伺服器，刪除節點伺服器上的部署包
sh 'rm -rf /mnt/workspace/xxx/admin.tar.gz /mnt/workspace/xxx/admin /home/apps/admin.tar.gz'
echo 'deploy success'
}
}
}
}
從上述的實際流水線指令碼，我們需要注意如下：
- 1、整個流水線語法的空格、縮排、換行，需要嚴格注意
- 2、一個stages裡面包含多個stage，可以理解為多個步驟
- 3、第一個步驟，一般都得指定git地址和分支、以及jenkins全域性配置的credentialsId 這樣才能拉取到制定分支的最新的程式碼。
- 4、執行shell命令 以sh 開頭，中間有空格，一行命令寫完後，注意換行。
- 用到了神奇的ansible命令工具。
理解ansible
首次看到ansible，是否是一頭霧水？先來看概念
ansible是新出現的自動化運維工具，基於Python開發，集合了眾多運維工具（puppet、cfengine、chef、func、fabric）的優點，實現了批量系統配置、批量程式部署、批量執行命令等功能。
從上述概念上，我們可以知道，ansible就是一個實現批量部署的工具。 假如你又10臺伺服器需要部署，部署的包、命令一模一樣，操作10次就太費勁了。引入ansible，就可提升效率。
1、下載安裝
yum install ansible -y
安裝後驗證一下：
ansible --version
2、新建一個ansible配置檔案
我們在節點伺服器的/mnt目錄下,新建一個hosts檔案：
// 新建或者編輯hosts檔案
vi hosts
// 輸入如下配置，並儲存
[admin]
admin-01 ansible_connection=local
admin-02 ansible_connection=1xx.1xx.1xx.1
admin-03 ansible_connection=1xx.1xx.1xx.2
[h5]
h5-01 ansible_connection=local
h5-02 ansible_connection=1xx.1xx.1xx.1
h5-03 ansible_connection=1xx.1xx.1xx.2
從上述命令，我們可以推斷出這麼一個場景：
- 1、需要部署的應用系統有2個組，一個是admin，一個是h5，且每個組下面有三臺應用伺服器
- 2、ansible_connection=local 表示該jenkins節點，自己也同時作為一臺應用伺服器。
最終，我們的ansible配置如下：
3、ansile命令
由第二步，我們可以知道，ansible配置路徑為/mnt/hosts，以此前我們用到的ansible命令為例
sh 'ansible admin -i /mnt/hosts -m copy -a "src=/mnt/workspace/xxx/admin.tar.gz dest=/home/apps"'
上述命令表示，將節點伺服器的mnt/workspace/xxx/admin.tar.gz（src=xxx）檔案拷貝，批量上傳到admin這個組裡面的所有伺服器的home/apps路徑下（ dest=xxx）上去。admin這個組下面有哪些伺服器？通過-i /mnt/hosts指定配置檔案來讀取。
sh 'ansible admin -i /mnt/hosts -m shell -a "tar -zxvf /home/apps/admin.tar.gz -C /home/apps/"'
上述命令，- m shell "[你的shell命令]",其實也很好理解。注意shell命令要有雙引號。
想了解更多的ansible相關的資訊，可點選Ansible中文權威指南。
五、jenkins構建
點選構建之前一定要確保節點伺服器 跟應用部署伺服器之間是免密訪問的（找運維人員處理即可）。 否者你的ansible命令就得重新寫，帶帶上登入使用者資訊才行。
再者，我們一直沒有強調節點伺服器搭建nodejs環境，這個也是必備的。 至於何如安裝nodejs環境，請參考Linux下nodejs環境搭建
我們開啟新建的item頁面，點選【build Now】
然後在構建任務列表，點選當前正在構建的任務
進入當前構建的詳情頁，--》【開啟 Blue Ocean】
我們可以看到上面的幾個步驟，就是我們流水線程式碼裡面的幾個stage，一一對應，模組層次分明。檢視構建日誌也方便，比傳統的Publish over SSH遠端部署方式要好很多。
結語
作為一個前端開發，我們應該學會用工具，來提升提升日常開發的效率。本篇以最繁瑣最笨的方式，來解決小公司小團隊的自動化部署問題。掌握了這種基本的技能，朝著devOps又更進一步了。當然，技術無所謂優劣，能解決你的實際問題的，就是好的技術。