如何使用Rancher發(fā)布前端服務(wù)過程詳解

更新時(shí)間：2023年08月25日 09:29:07 作者：HerryLo

這篇文章主要為大家介紹了如何使用Rancher發(fā)布前端服務(wù)過程詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪

正文

項(xiàng)目中用到rancher發(fā)布前端代碼，我自己參與了一次構(gòu)建，遇到了很多的問題，不過一一解決了，用閑暇的時(shí)間，將遇到的問題記下來，也算是一次復(fù)盤了。

rancher是一個(gè)開源的企業(yè)級(jí)容器管理平臺(tái)，重點(diǎn)“容器管理”，可以極大的簡(jiǎn)化容器管理的復(fù)雜度（相對(duì)于K8s）,它是對(duì)于k8s容器引擎的封裝，有興趣可以看看官方文檔。

上傳鏡像

需要先安裝docker，確保docker是可以使用的。下面是Dockerfile文件和default.conf文件

FROM  nginx
COPY ./build /usr/share/nginx/html/
COPY ./default.conf /etc/nginx/conf.d/
EXPOSE 80

Dockerfile文件主要用于docker鏡像的創(chuàng)建；

FROM nginx：FROM指令初始化一個(gè)新的構(gòu)建階段，并為后續(xù)指令設(shè)置基礎(chǔ)鏡像，這里的基礎(chǔ)鏡像是nginx；

COPY ./build /usr/share/nginx/html/：./build是前端打包之后的文件地址，將它復(fù)制到nginx的html目錄下；

COPY ./default.conf /etc/nginx/conf.d/：./default.conf是nginx配置文件, 將它復(fù)制到nginx的conf.d目錄下；

EXPOSE 80：監(jiān)聽80端口；

打包代碼

通過如下命令行打包代碼（實(shí)際代碼根據(jù)自己項(xiàng)目而定）：

// 前端本地打包
$ npm run build:prod
// 移除之前舊的鏡像
$ docker rmi xx.harbor.com:10443/xx/front-web-project:1.0.0
// 構(gòu)建鏡像
$ docker build -f Dockerfile -t xx.harbor.com:10443/xx/front-web-project:1.0.0 .
// push 鏡像到鏡像倉庫
$ docker push xx.harbor.com:10443/xx/front-web-project:1.0.0

鏡像倉庫是提前構(gòu)建好的，可以找運(yùn)維工程師確認(rèn)。我上面使用到的是harbor鏡像存儲(chǔ)庫，這個(gè)是運(yùn)維工程師搭建好的，我這邊可以直接使用。鏡像名和tag根據(jù)自己項(xiàng)目實(shí)際來。

Nginx配置

下面就是nginx配置文件，由于是前端項(xiàng)目，nginx主要在這里做的就是靜態(tài)資源服務(wù)器，接口代理。

server {
  listen       80;
  add_header Access-Control-Allow-Origin *;
  add_header Access-Control-Allow-Credentials true;
  add_header Access-Control-Allow-Methods *;
  client_max_body_size 2000M;
  location / {
    root   /usr/share/nginx/html/;
    index  index.html index.htm;
    try_files $uri /index.html;
  }
}

nginx配置文件根據(jù)自己的實(shí)際需求編寫，更多的配置也可以在這里繼續(xù)添加（比例接口代理，負(fù)載均衡等）。

工作負(fù)載

rancher是一個(gè)容器管理平臺(tái)，是k8s的二次封裝，提供更豐富的功能，有興趣的同學(xué)，可以看看官網(wǎng) 的相關(guān)資料。在rancher里工作負(fù)載是一個(gè)對(duì)象，包括pod以及部署應(yīng)用程序所需的其他文件和信息。

以下是rancher中工作負(fù)載服務(wù)的創(chuàng)建過程：

點(diǎn)擊部署服務(wù)，進(jìn)入到創(chuàng)建工作負(fù)載界面：

Docker鏡像地址是你已經(jīng)上傳的 前端鏡像地址 ，主機(jī)端口需要 找運(yùn)維確認(rèn)端口 ，命名空間可選中已有的。容器端口一般都是 80，這和你的 default.conf配置端口相關(guān)。以上填寫完成之后，滑動(dòng)到底部，點(diǎn)擊升級(jí)按鈕。

點(diǎn)擊進(jìn)入創(chuàng)建完成的工作負(fù)載中，如果pods中存在正常running的pod實(shí)例，既是創(chuàng)建成功。如果存在其他問題，可以參考下面 出現(xiàn)的問題，進(jìn)行相關(guān)問題的排查。