前言

在日常开发过程中，ci（持续集成）/cd（持续交付）是一个不可或缺的好帮手，有了他，开发者可以只专注于开发，把开发好后的构建部署一些列操作都交给ci机器人去做，大大的节省了人力成本。

什么是ci/cd

先回想一下我们在每次开发完成之后部署站点都会经历哪几个过程

• 1.执行构建命令
• 2.将构建产物复制到服务器对应目录下

这几个步骤其实都是重复的，而ci/cd就是通过一系列的脚本去机械化的完成这些操作，节省人力的同时还更不容易出错 下面就以gitlab ci举个简单的例子

gitlab runner

gitlab中使用ci需要借助到runner

• 安装runner

sudo apt-get install gitlab-runner

runner文档 (opens new window)

-注册runner

sudo gitlab-runner register

之后是QA式操作，按照提示语输入信息即可，可参考官网操作，需要注意： ①. gitlab host和token在你的gitlab项目上找，页面路径是：Settings >> CI/CD >> Runners

②. runner执行器选择 docker，image（镜像）输入 node:8.11.2-stretch

注册成功后，我们就能在：Settings >> CI/CD >> Runners下看到我们注册的runner

Gitlab-Runner配置

在项目根目录下新建 .gitlab.yml文件，加入如下内容：

stages:
  - package
  - upload
  - build
  - deploy
  - notify

variables:
  REGISTRY_NAME: "registry-vpc.cn-hangzhou.aliyuncs.com/odbpo/"
  IMAGE_NAME: ${REGISTRY_NAME}${CI_COMMIT_BRANCH}_${CI_PROJECT_NAME}
  PORT: "80"
  LIMIT_CPU: "2"
  LIMIT_MEMORY: "200m"
  DEFAULT_ROUTER: "Host(`h5.dev.hunshehui.cn`)&&PathPrefix(`/cms`)"
  HEALTH_URL: "/index.html"
  CONTAINERS_NUM: 2


cache: &global_cache
  # `key`=`prefix`+`-`+`SHA(files)`
  key:
    # 判定缓存是否需要更新的文件，最多两个
    files:
      - package.json
    # 生成目录的前缀，可以不定义
    prefix: ${CI_COMMIT_BRANCH}
  paths:
    - node_modules
    - "dist/"


node-build:
  image: node:14.17.0
  stage: package
  before_script:
    - 'which ssh-agent || ( yum update -y && yum install openssh-client git -y ) '
    - eval $(ssh-agent -s)
    - echo "$SSH_PRIVATE_KEY_BELIFE" | tr -d '\r' | ssh-add -
    - mkdir -p ~/.ssh
    - chmod 700 ~/.ssh
    - ssh-keyscan $IP_KEY_TEST_BELIFE >> ~/.ssh/known_hosts
    - chmod 644 ~/.ssh/known_hosts
  script:
    # 将镜像源设置成淘宝镜像
    - yarn config set registry https://registry.npmmirror.com
    - yarn
    - yarn run build:${CI_COMMIT_BRANCH}
    - yarn run upload:${CI_COMMIT_BRANCH}
#    - ossutil64 config -e $OSS_END_POINT -i $OSS_ACCESS_KEY_ID -k $OSS_ACCESS_KEY_SECRET
#    - ossutil64 cp -r -f dist/ oss://$OSS_BUCKET_NAME
#    - ssh-keygen
#    - ssh-copy-id -i .ssh/id_rsa.pub  root@8.222.250.20
    - scp -r ./dist/index.html root@$IP_KEY_TEST_BELIFE:/mnt/belife-work/h5/
#    - sshpass -p ZVd+KPxFMsANQp$T scp -r ./dist/index.html root@8.222.250.20:/mnt/belife-h5-app
  cache:
    <<: *global_cache
  artifacts:
    name: "$CI_COMMIT_BRANCH-$CI_COMMIT_SHORT_SHA"
    paths:
      - dist/index.html
  only:
    - dev
    - test
    - pre
    - main
  tags:
    - runner-vue-dev

notifySuccess:
  image: appropriate/curl:latest
  stage: notify
  when: on_success
  cache: {}
  script:
    - curl 'https://oapi.dingtalk.com/robot/send?access_token=80279843cd3236168a05e8f1cab5efb0df8a7a71f37cb4c61bc735bfe7c3bd47' -H 'Content-Type:application/json' -d "{\"msgtype\":\"markdown\",\"markdown\":{\"title\":\"构建通知\",\"text\":\"# [${CI_COMMIT_BRANCH}_${CI_PROJECT_NAME}](${CI_PROJECT_URL})\n---\n- 流水线：[#${CI_PIPELINE_ID}](${CI_PROJECT_URL}/-/pipelines/${CI_PIPELINE_ID})\n- 状态：<font color=#52c41a>成功</font>\n- 执行人：${GITLAB_USER_EMAIL}\"}}"
  tags:
    - runner-vue-dev
  only:
    - dev
    - test
    - main

notifyFailed:
  image: appropriate/curl:latest
  stage: notify
  when: on_failure
  cache: {}
  script:
    - curl 'https://oapi.dingtalk.com/robot/send?access_token=80279843cd3236168a05e8f1cab5efb0df8a7a71f37cb4c61bc735bfe7c3bd47' -H 'Content-Type:application/json' -d "{\"msgtype\":\"markdown\",\"markdown\":{\"title\":\"构建通知\",\"text\":\"# [${CI_COMMIT_BRANCH}_${CI_PROJECT_NAME}](${CI_PROJECT_URL})\n---\n- 流水线：[#${CI_PIPELINE_ID}](${CI_PROJECT_URL}/-/pipelines/${CI_PIPELINE_ID})\n- 状态：<font color=#f5222d>失败</font>\n- 执行人：${GITLAB_USER_EMAIL}\"}}"
  tags:
    - runner-vue-dev
  only:
    - dev
    - test
    - main

这里大致介绍一下里面的一些key都是什么意思

• stages：定义任务，可配置多个
• variables： 定义一些变量，可在下文中使用
• 每个job都可以指定stage，执行对应的stage时就回去执行对应的job，如上文示例中node-build指定了stage为package，那执行package这个stage的时候就回去执行node-build这个job。
• 剩下几个关键点可以自行百度一下。相信大概看一下也能猜到是做什么的了

铺垫了这么多，下面终于可以开始进入正文了

在ci过程中遇到的问题

我们都知道部署是需要把最终的构建产物放到服务器上去的，那这里就不可避免的出现一个登录服务器的操作。而在ci脚本中是无法进行交互的，也就是说我们没办法去输入密码登录。那就只有想办法免密登录 在ssh协议里有一个非常经典的操作，那就是公钥密钥验证，免密登录。而本文也正式采用这个方式。其实用过gitlab的应该都知道，gitlab里有一个操作就是本机生成ssh_key,然后将他添加到gitlab中既可以免密码拉代码。我们免密登录服务器就和这个差不多

如果你的runner是不变的，那只需要在runner里生成一个ssh_key然后将这个key放到服务器的/.ssh/authorized_keys文件里即可免密登录，而我们公司的runner是从镜像里拉出来的，也就是每次都不一样，所以无法采用刚刚说的那种办法。那另外一种办法就是，在某个机器生成一个ssh_key，将他放到服务器上，然后在ci里将这个key也放到runner里，相当于runner里的key现在是已经通过验证的了。这样就可以验证通过了。

 before_script:
    - 'which ssh-agent || ( yum update -y && yum install openssh-client git -y ) '
    - eval $(ssh-agent -s)
    - echo "$SSH_PRIVATE_KEY_BELIFE" | tr -d '\r' | ssh-add -
    - mkdir -p ~/.ssh
    - chmod 700 ~/.ssh
    - ssh-keyscan $IP_KEY_TEST_BELIFE >> ~/.ssh/known_hosts
    - chmod 644 ~/.ssh/known_hosts
 script:
    # 将镜像源设置成淘宝镜像
    - yarn config set registry https://registry.npmmirror.com
    - yarn
    - yarn run build:${CI_COMMIT_BRANCH}
    - yarn run upload:${CI_COMMIT_BRANCH}
    - scp -r ./dist/index.html root@$IP_KEY_TEST_BELIFE:/mnt/belife-work/h5/

$SSH_PRIVATE_KEY_BELIFE就是你本机生成的ssh_key，这里将他配置到了gitlab的变量里，$IP_KEY_TEST_BELIFE是你服务器的地址，也就是ip

结语

以上就是本文的全部内容，文中很多概念描述的比较笼统，主旨是为了解决如何免密登录服务器这个问题，至于ci脚本的编写，以及gitlab runner的安装啥的可自行搜索一下教程。ci/cd是工程化中重要的一环，身为一个合格的前端也应该去掌握。加油！

文章参考: 使用gitlab runner ci 通过ssh部署项目到远程服务器 (opens new window);

使用gitlab runner部署项目 (opens new window);

gitlab配置ssh keys认证失败_用GitLab-Runner打造锋利的CI/CD (opens new window)