前端工程化

Docker · 07 Dec 2021

Centos

Centos 是一个基于 Linux 的开源免费操作系统，常用于服务端的系统。

# 本地拷贝文件到远程服务器：
# output.txt:本地文件
# root:登录远程服务器的账号
# 47.93.242.155:远程服务器的 IP
# /data/:远程服务器的目录
scp output.txt root@47.93.242.155:/data/

# ssh -p 端口 用户名@服务器IP
# 本地链接远程 Centos 服务器
ssh -p  22  root@47.93.242.155

# 检查端口被哪个进程占用
netstat -lnp|grep 88   #88请换为你需要的端口，如：80

# 杀掉编号为1777的进程（请根据实际情况输入）
kill -9 1777

Nginx

Nginx 是一个高性能的 HTTP 和反向代理 web 服务器。

安装

# Centos 下安装 Nginx 服务器
yum install -y nginx

# 启动nginx，访问 http://<您的域名或IP>，若无法访问 nginx -s reload 命令重启 Nginx
nginx

配置静态服务器访问路径

外网用户访问服务器的 Web 服务由 Nginx 提供，Nginx 需要配置静态资源的路径信息才能通过 url 正确访问到服务器上的静态资源。

// 修改默认配置文件：将默认的 `/usr/share/nginx/html;` 修改为: `/data/www`
vi /etc/nginx/nginx.conf

配置 SSL 泛域名证书

创建 /data/cert 目录用来存放证书文件，使用 scp 命令上传文件到远程服务器：scp D:/https/* root@47.93.242.155:/data/cert。Nginx 启动后默认只监听 80 端口，把全局配置文件 /etc/nginx/nginx.conf 开启监听 443。

配置反向代理

客户端对代理服务器是无感知的，用户只请求反向代理服务器，反向代理服务器选择目标服务器，获取数据后再返回给客户端。

反向代理服务器和目标服务器对外而言就是一个服务器，只是暴露的是代理服务器地址，而隐藏了真实服务器的 IP 地址。

; 实际 index.html 的存放地址 /data/www/index.html
; 修改 location 处，访问 http://127.0.0.1:8080/api/index.html 与 http://127.0.0.1:8080/index.html 是一致的
server {
  listen       80;
  server_name  www.123.com;

  location /api/ {
    proxy_pass http://127.0.0.1:8080/;
  }
}

Node.js

# 查看当前系统自带了哪些nodejs的版本
sudo dnf module list nodejs

# 切换默认安装的版本
sudo dnf module enable nodejs:14

# 安装 Node
sudo dnf install nodejs

nvm 方便的在同一台设备上进行多个node版本之间切换，可能不同项目依赖的 node 版本不一致。

Docker

安装配置

安装 docker 之前，先安装以下两个依赖：

device-mapper-persistent-data 是 Linux 下的一个存储驱动， Linux 上的高级存储技术。
Lvm的作用则是创建逻辑磁盘分区。

yum install -y yum-utils device-mapper-persistent-data lvm2
# 设置 docker 镜像源
sudo yum-config-manager --add-repo http://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo
# 社区版（ce）企业版（ee）
yum install docker-ce -y
# 使用 systemctl 启动 Docker。systemctl 是 linux 的进程管理服务命令
systemctl start docker
# 设置开机启动
systemctl enable docker

安装 docker-compose

# 安装
sudo curl -L "https://github.com/docker/compose/releases/download/1.29.2/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
# d对二进制文件应用可执行权限
sudo chmod +x /usr/local/bin/docker-compose
# 查看版本号
docker-compose -v

CI/CD

一个版本的发布过程，经历以下步骤：

代码合并：测试环境或生产环境都有独立的分支，待测试通过后提交到主支。
打包（即构建）：生产环境分支拉取最新代码，通过 webpack 打包。一般是定义在 package.json 的 script 中命令。
部署：将打包的文件放到 web 容器中，而 web 容器部署在 Linux 服务器上。

GitLab 监控

当代码合并到生产环境后，GitLab 自动完成打包和部署两个步骤。

代码托管平台提供了 Webhooks 用于监控类似于 Push/Merge 事件。

Pipeline 是CI/CD的最上层组件，它翻译过来是管道，其实你可以将之理解为流水线，每一个符合.gitlab-ci.yml触发规则的 CI/CD 任务都会产生一个 Pipeline

有了流水线，还必须有辛勤的工人进行生产作业，Runner在 Gitlab Pipeline 中就扮演着工人角色，根据我们下达的指令进行作业。在 Gitlab 中，Runner 有很多种，分为Shared Runner, Group Runner, Specific Runner。Shared Runner 可以服务于各个 Project。Group Runner 服务指定的 Group。Specific Runner 只服务于指定的项目。

.gitlab-ci.yml 用于配置 CI/CD 流程与步骤

workflow:
  rules:
    - if: '$CI_COMMIT_REF_NAME == "master"' # 仅限于 master 分支执行
states:
  - build # 构建阶段
  - deploy # 部署阶段
build_prod: # 定义 job：构建
  state: build
  cache:
    key: build_prod
    paths:
      - node_modules/
    script:
      - yarn install
      - yarn build:prod
    artifacts: # 打包后文件存放位置
      paths:
        - dist
deploy_prod: # 定义 job：部署
  state: deploy
  script:
    - scp -r $CI_PROJECT_DIR username@host:/usr/share/nginx/html # 通过scp命令向 linux 服务器上的 nginx 目录下传输文件

Gitlab 通过 Variables 为 CI/CD 提供了更多配置化的能力，方便我们快速取得一些关键信息，用来做流程决策。上述示例中的 $CI_COMMIT_REF_NAME 和 $CI_PROJECT_DIR 就是 Gitlab 的预定义变量。除了预定义变量，我们也可以自行定义一些环境变量，比如服务器 ip，用户名等等，这样就免去了在配置文件中明文列出私密信息的风险；另一方面也方便后期快速调整配置，避免直接修改.gitlab-ci.yml。

自动部署

写脚本 (改用 .ssh/config 文件，可以简化 scp 命令)

#!/bin/bash
git checkout develop
git pull
npm run build:test

# ~/.ssh目录下创建密钥对
ssh-keygen -t rsa
# 把公钥传输到服务器上，使用 ssh 认证，不用每次输密码
scp ~/.ssh/id_rsa.pub username@123.123.123.1:/home/username/.ssh/authorized_keys

# i 参数指定传输时使用的密钥文件, r 参数递归复制整个目录
scp -i ~/.ssh/id_rsa -r ./dist/. username@123.123.123.1:/usr/share/nginx/html/projectname/

修改 package.json

"scripts": {
  "deploy:test": "deploy-test.sh"
}

Jenkins

# 进入名为 docker-jenkins 容器，获取 jenkins 登录密码
docker exec -it docker-jenkins bash
cat /var/jenkins_home/secrets/initialAdminPassword
# 重启 jenkins
http://localhost:8008/restart/

# 生成 ssh key (公钥 Github)
ssh-keygen -t rsa -C chen_natalie@outlook.com
cat ~/.ssh/id_rsa.pub

# 生成私钥 jenkins 凭证