从零开始使用 gitlab 进行自动化部署

前言

一个新的项目,分别需要经过技术选型、基础功能搭建、制定开发规范、需求开发、项目发布等步骤。

对前面的步骤都还是比较了解,唯独最后一步,项目发布,总有种管中窥豹的感觉。虽知道可以通过 GitlabCI/CD 来实现自动化部署。可是,具体应该怎么做呢?

这问题困扰了我很久,恰好最近公司提供了一个机会,研究网站性能优化方案。在完成公司网站的性能优化后,打算对自己的 blog 也进行一次升级(之前使用 github pages 部署的,国内访问超慢)。借此机会,也来完整地走一遍从一个新项目到自动化部署完成这样的一个流程。

这里,就对使用 gitlab 进行自动化部署来进行一个总结。

环境

  • 腾讯云轻量应用服务器
  • 操作系统 – Ubuntu Server 18.04.1 LTS 64bit
  • gitlab
  • Docker
  • Nginx
  • node v14.17.6

前端框架

  • nuxtJS
  • 项目使用 nuxt/content 脚手架进行开发

参考链接: https://www.nuxtjs.cn/blog/creating-blog-with-nuxt-content

工具

  • putty (登录服务器工具)
  • winSCP(将本地的文件或文件夹传输到服务端工具)

操作步骤

域名申请

可以通过 域名注册 进行申请购买。

从零开始使用 gitlab 进行自动化部署
域名注册

域名备案

申请成功后,需要对域名进行备案,想了解为什么需要备案,可以查看  这里。

备案时间不同地方所需要的时间不同,有的可能需要 10 天以上。所以,建议在项目开发之初,先进行备案申请,以免项目开发完后,影响项目正常上线运行。

备案方法可以直接通过腾讯云管理台上面的 备案 进行,跟着步骤走,提交对应的审核资料就可以了。

从零开始使用 gitlab 进行自动化部署
备案

安装 docker

有好几个步骤,就不一一罗列出来,感兴趣的朋友可以点击下方链接直接访问。

参考链接:https://docs.docker.com/engine/install/ubuntu/

使用 docker 安装 nginx

安装好 docker 后,就可以使用 docker 获取指定的镜像了,我们使用 nginx 作为项目的服务器。

执行:

docker pull nginx:latest

检查 nginx 是否成功。

执行:

docker run -d --name nginx -p 80:80 nginx

访问 公网 ip *.*.*.*。看是否有以下内容出现。

从零开始使用 gitlab 进行自动化部署
test page

域名解析

通过以上步骤,能实现通过服务器 公网IP 来对网站进行访问了。但通过 IP 访问确实不是方便。将第一步的域名在这里进行解析。

从零开始使用 gitlab 进行自动化部署
域名解析

解析完成后,就可以直接通过域名对网站进行访问了。

验证成功后,移除测试用的 docker 服务,执行:

docker stop nginx && docker rm nginx

如果对 docker 不熟悉,可以查看 官方文档 https://docs.docker.com/。

配置 nginx

/home/ubuntu/www/nginx/conf.d 目录下新建 default.conf(路径仅作为参考,具体路径可以根据自己的服务器目录来定),内容如下:

server {
    listen       80;
    server_name  xiangming.tech;
    return 301 https://$server_name$request_uri;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}

添加证书

从 腾讯云的 SSL 证书管理 处 购买 或者 免费申请SSL 证书。

从零开始使用 gitlab 进行自动化部署
添加证书

使用 winSCP (windows 版本), 将证书放在 /home/ubuntu/www/nginx/conf.d/cert 目录下。

从零开始使用 gitlab 进行自动化部署
证书上传

其它操作系统可以参考:https://cloud.tencent.com/document/product/1207/53135

让项目支持 https,在 /home/ubuntu/www/nginx/conf.d 目录下添加 ssl.conf。内容如下:

server {
    # 服务器端口使用443,开启ssl, 这里ssl就是上面安装的ssl模块
    listen       443 ssl;
    # 域名,多个以空格分开
    server_name  xiangming.tech;

    # ssl证书地址
    ssl_certificate     /etc/nginx/conf.d/cert/xiangming.tech_bundle.pem;  # pem文件的路径
    ssl_certificate_key /etc/nginx/conf.d/cert/xiangming.tech.key; # key文件的路径

    # ssl验证相关配置
    ssl_session_timeout  5m;    #缓存有效期
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;    #加密算法
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;    #安全链接可选的加密协议
    ssl_prefer_server_ciphers on;   #使用服务器端的首选算法

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }
}

注意:如果不添加 SSL,浏览器链接的左边会显示 No secure 安全警告。

启动 nginx

docker run --name nginx -d -p 80:80 -p 443:443 -v /home/ubuntu/www/nginx/conf.d:/etc/nginx/conf.d -v /home/ubuntu/www/blogs:/usr/share/nginx/html  -v /home/ubuntu/www/nginx/log:/var/log/nginx nginx

注意

  1. 因为启用了 SSL,所以需要将 80443 两个端口都暴露出来。
  2. 使用 -v 对配置文件进行挂载。

此时,可以在 /home/ubuntu/www/blogs 目录下添加一个 index.html,随便写一点内容,就可以看到效果了。

从零开始使用 gitlab 进行自动化部署
测试页面代码

通过域名访问首页

从零开始使用 gitlab 进行自动化部署
测试页面

使用 docker 安装 gitlab-runner

获取 gitlab-runner 镜像

docker pull gitlab/gitlab-runner

启动 gitlab-runner 服务

docker run -d --name gitlab-runner --restart always 
  -v /var/run/docker.sock:/var/run/docker.sock 
  -v /srv/gitlab-runner/config:/etc/gitlab-runner 
  gitlab/gitlab-runner:latest

gitlab-runner 注册到 gitlab 中,执行

docker run --rm -it -v /srv/gitlab-runner/config:/etc/gitlab-runner gitlab/gitlab-runner register

提示输入 gitlab instance URL

从零开始使用 gitlab 进行自动化部署
terminal

gitlab 对应的 项目 > Settings > CI/CD > Runners 下面找到

从零开始使用 gitlab 进行自动化部署
获取 url

https://gitlab.com/ 复制然后粘贴到刚才需要输入的地方,然后会提示输入 token

从零开始使用 gitlab 进行自动化部署
添加 token

点击这里,复制 token,粘贴到命令行中

从零开始使用 gitlab 进行自动化部署
获取 token

然后根据步骤,输入描述、runner 的名称(tags),最后选择是使用使用执行,我们输入 docker

从零开始使用 gitlab 进行自动化部署
执行步骤截图
1. Run the register command based on the mount type:
2. Enter your GitLab instance URL (also known as the gitlab-ci coordinator URL).
3. Enter the token you obtained to register the runner.
4. Enter a description for the runner. You can change this value later in the GitLab user interface.
5. Enter the tags associated with the runner, separated by commas. You can change this value later in the GitLab user interface.
6. Enter any optional maintenance note for the runner.
7. Provide the runner executor. For most use cases, enter docker.
8. If you entered docker as your executor, you are asked for the default image to be used for projects that do not define one in .gitlab-ci.yml.

注意第 8 步,如果选择的是 docker,需要输入一个默认的执行环境,这里我输入的是 node:14.17.6

参考链接:https://docs.gitlab.com/runner/install/docker.html

前端项目添加 .gitlab-ci.yml

在项目的根目录下添加 .gitlab-ci.yml 文件,内容如下:

stages:
  - build

before_script:
  - 'command -v ssh-agent >/dev/null || ( apt-get update -y && apt-get install openssh-client -y )'
  - eval $(ssh-agent -s)
  - echo "$SSH_PRIVATE_KEY" | tr -d 'r' | ssh-add -
  - mkdir -p ~/.ssh
  - chmod 700 ~/.ssh

# cache:
#   paths:
    # - node_modules

build:
  stage: build
  script:
    - npm install --registry=https://registry.npm.taobao.org
    - npm run generate
    - scp -o StrictHostKeyChecking=no -o UserKnownHostsFile=/dev/null -r ./dist/** ubuntu@*.*.*.*:/home/ubuntu/www/blogs
  tags:
    - blog3
  only:
    - master

这一步有三个关键点:

  1. before_script 中配置 ssh 免密登录,以方便在后续步骤的文件上传。
  2. buildscript 中,将生成好的文件通过 scp 的方式传到服务器指定的文件目录下。
  3. build 下的 tags 名称,就是我们在注册 runner 时自己写的 tags 名称。

做完以上步骤,向 master 上提交新的 commit。等待 CI/CD 执行完成。在浏览器中,通过服务器公网 IP 就能正常访问刚刚发布的内容了。

从零开始使用 gitlab 进行自动化部署
CI/CD执行成功

后面如果有什么内容的修改或者添加,开发完后,提交或者合并到 master 分支,项目就会自动打包并构建。大约 2分钟 左右,就能看到最新提交的内容了。

办理公安备案

为规范网络安全化,维护网站经营者的合法权益,保障网民的合法利益,所以部分地区除了完成 ICP备案 后还需要进行公安局备案。

具体的备案方法可以参考:https://cloud.tencent.com/document/product/243/19142

TODO

  • 添加用户登录功能
  • 添加用户评论功能
  • 集群
  • 负载均衡
  • SEO
  • 性能优化
  • ……

总结

很多步骤在网上都能找到对应的方法,但我还是想自己亲自动手操作一遍。因为我知道我肯定会遇见问题,在困难中解决问题,这样印象会更加地深刻。在实际操作的过程中我遇见的比较困扰我的问题有:

  • gitlab-runner 配置好后,无法正常执行,一直报 New runner, has not contacted yet 错误怎么解决?
  • 执行 CI 时,每次都要 pull 默认的镜像,会占用许多的时间,如何优化它?
  • gitlab-runnerserver 如何联通?
  • 如何上传 build 后的文件?
  • 上传文件时,一直报 Permission denied 是什么原因?
  • 一个网站到能正常运行,需要准备些什么资料?哪些是需要提前准备的?
  • ……

上面的这些问题,每一个都让我头疼过,不过最后一个一个地解决了,收获满满。有兴趣的朋友可以试一下,有问题咱们可以互相讨论、互相学习。

不足之处以及有可以优化的地方,请大佬们不吝指正!!!



原文始发于微信公众号(前端学习总结):从零开始使用 gitlab 进行自动化部署

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由半码博客整理,本文链接:https://www.bmabk.com/index.php/post/83095.html

(0)

相关推荐

发表回复

登录后才能评论
半码博客——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!