手把手教你安装Jenkins并自动部署你的Gitee项目

someCat
2,659 阅读3分钟

本文记录一下在自己的云服务器上自动部署我在Gitee上的项目的过程。读完你将收获到以下能力：

  • 在Centos 8.5上安装和配置Jenkins
  • Nginx安装和配置
  • 使用Let's Encrypt免费生成证书并配置整站https（需要你有自己的域名）
  • NVM、Node和Git的安装和配置
  • 配合Gitee创建第一个自动化部署项目

注意：以下流程基于Centos 8.5系统，低版本也不是不行，就是会出现奇奇怪怪的问题。

安装Jenkins

# 下载 Jenkins 资源
sudo wget -O /etc/yum.repos.d/jenkins.repo https://pkg.jenkins.io/redhat-stable/jenkins.repo
# 获取并导入信任 的包制作者的秘钥
sudo rpm --import https://pkg.jenkins.io/redhat-stable/jenkins.io-2023.key
# 升级 yum 源中的所有包
sudo yum upgrade
# Jenkins 依赖于 java 所以需要安装 JDK
sudo yum install java-11-openjdk
# 安装 Jenkins
sudo yum install jenkins

最后一步可能会出现以下报错

image.png

是因为jenkins的BaseURL还是http的，得去编辑一下

  1. 输入以下命令打开 jenkins.repo 文件：
vim /etc/yum.repos.d/jenkins.repo
  1. 在 vim 编辑器中，按i键开始编辑文件，然后把baseurl的值改为pkg.jenkins.io/redhat
    name=Jenkins
    baseurl=https://pkg.jenkins.io/redhat
    gpgcheck=1
  1. 按 Esc 键退出编辑模式，然后输入 :wq 保存并退出文件。

可能会出现Public key没安装的报错

image.png

可能是因为密钥地址改了，截至2024年7月上述给的链接是最新的，如果你发现还是说key没安装，建议去Jenkins官网 找找最新下载地址。

启动Jenkins

输入以下指令即可启动Jenkins并设置开机自启

sudo systemctl start jenkins
sudo systemctl enable jenkins

验证Jenkins安装

打开浏览器访问 http://[公网IP]:8080 ，出现以下页面即代表成功！

安全组记得放行8080端口

image.png

初始密码可以用以下命令获取：

sudo cat /var/lib/jenkins/secrets/initialAdminPassword

之后正常就可以去配置并创建Jenkins项目了，但我这个是新的服务器，想用域名访问，并配置https，同样情况的同学可以继续往下看，否则可以跳到后边。

使用Let's Encrypt生成证书并配置整站https

这里我们使用Let's Encrypt证书。让通义灵码简单介绍下：

image.png

安装Certbot证书安装工具

sudo yum install epel-release -y
sudo yum install certbot -y

我们使用通配符证书，这样可以涵盖未来所有子域名。以下是获取通配符证书的命令：

// 把somecat.cn改为你的域名
sudo certbot -d somecat.cn -d '*.somecat.cn' --manual --preferred-challenges dns certonly

按照提示添加DNS TXT记录，可能需要重复3次左右，遇到问题重试下就好了，完成后既得到了证书和私钥2个文件！如下图：

image.png

安装和配置Nginx

现在我们快速配置下Nginx让https生效。

安装Nginx

sudo yum install nginx

安装后编辑配置文件

sudo vi /etc/nginx/nginx.conf

打开后直接键盘敲100dd清空配置（实际意思是删除100行代码），然后基于下面这份配置，把其中的域名改成你的，复制进去：

# For more information on configuration, see:
#   * Official English Documentation: http://nginx.org/en/docs/
#   * Official Russian Documentation: http://nginx.org/ru/docs/

user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;

# Load dynamic modules. See /usr/share/doc/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;

events {
    worker_connections 1024;
}

http {
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile            on;
    tcp_nopush          on;
    tcp_nodelay         on;
    keepalive_timeout   65;
    types_hash_max_size 2048;

    include             /etc/nginx/mime.types;
    default_type        application/octet-stream;

    # Load modular configuration files from the /etc/nginx/conf.d directory.
    # See http://nginx.org/en/docs/ngx_core_module.html#include
    # for more information.
    include /etc/nginx/conf.d/*.conf;


    server {
        listen 80;
        server_name somecat.cn;
        return 301 https://$host$request_uri;
    }

    server {
        listen 443 ssl;
        server_name somecat.cn;

        ssl_certificate /etc/letsencrypt/live/somecat.cn/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/somecat.cn/privkey.pem;

        location / {
            proxy_pass http://127.0.0.1:1617;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;
        }
    }

    server {
        listen 80;
        server_name jenkins.somecat.cn;
        return 301 https://$host$request_uri;
    }

    server {
        listen 443 ssl;
        server_name jenkins.somecat.cn;

        ssl_certificate /etc/letsencrypt/live/somecat.cn/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/somecat.cn/privkey.pem;

        location / {
            proxy_pass http://127.0.0.1:8080;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;
        }
    }
}

按Esc键退出编辑模式，然后输入:wq保存并退出文件。

启动Nginx并配置自动启动

sudo systemctl start nginx
sudo systemctl enable nginx

完成后，记得去域名服务商那把对应的子域名解析到服务器公网IP，再用域名访问即可小功告成！

image.png

配置Jenkins

接下来就回到Jenkins这边，通过initialAdminPassword获取到管理员密码后就可以“解锁”了。

这里我们选择安装推荐的插件

image.png

然后等待安装

image.png

等待时间比较长，我们先回到服务器那边去安装配置好其他东西。

NodeJs的安装和配置

推荐使用 Node Version Manager (nvm) 来安装和管理 Node.js 版本。

安装并加载nvm

wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
source ~/.nvm/nvm.sh

使用 nvm 安装Node.js，这里以20版本为例子，毕竟不建议安装最新版

nvm install 20

image.png

验证 Node.js 和 npm 是否安装成功：

node -v
npm -v

PNPM安装

好用的依赖管理工具，我这因为项目需要，推荐大家伙都装一下

npm install -g pnpm

Git的安装和配置

sudo yum install git

安装后配置下你的name和email

git config --global user.name 'someCat'
git config --global user.email 'zt@somecat.cn'

# 检查看下
git config user.name
git config user.email

生成服务器的SSH密钥

ssh-keygen -t rsa -b 4096 -C "zt@somecat.cn"

按照提示操作，生成的密钥对将存储在~/.ssh/id_rsa和~/.ssh/id_rsa.pub。

添加SSH密钥到Gitee

查看公钥，并复制

cat ~/.ssh/id_rsa.pub

登录到你的Gitee账户，进入设置 -> SSH公钥 -> 添加公钥。将刚刚复制的公钥粘贴到“公钥”字段中，并保存即可！

好了配套的东西准备完成，继续回到Jenkins页面（推荐依赖应该已经安装完成了）

继续配置Jenkins

创建账户，然后保存

image.png

image.png

image.png

配置私钥

回到服务器，通过以下指令拿到并复制私钥

sudo cat ~/.ssh/id_rsa

再回到Jenkins，进入Manage Jenkins -> 凭据 -> 系统 -> 全局凭据，点击Add Credentials，根据下图添加SSH私钥。

image.png

安装必须插件

先去Manage Jenkins -> Plugins -> Available plugins安装Gitee插件

image.png

安装Nodejs插件

image.png

去Manage Jenkins -> 全局工具配置(Plugins)，根据需要新增NodeJs环境

image.png

创建第一个Jenkins自动化部署项目

回到首页点击Create a job创建一个新的Freestyle project

image.png

我们到源码管理，填入仓库地址，选择刚刚配置好的私钥，指定好用于打包的分支

image.png

这里如果你想部署你的私仓，即SSH方式，第一次可能会报错，如下图：

image.png

此时你需要去Manage Jenkins -> 全局安全配置(Security)，配置Git Host Key鉴权方式为Accept first connection，保存即可。

image.png

回到Jenkins，配置好可以触发构建的分支 image.png

打开Gitee webhook构建

image.png

生成密码

image.png

然后去对应的Gitee仓库页面 -> 管理 -> WebHooks 管理，把对应的Webhook加进去，即可实现提交代码后自动触发构建的能力。

image.png

回到Jenkins，指定Node环境

image.png

配置好构建的指令

image.png

corepack enable pnpm
pnpm i
pnpm run build

保存，然后点击立即构建，完成后看看控制台输出。

image.png

从中可以看到项目目录在/var/lib/jenkins/workspace/FirstProject下

image.png

我们希望打包后的网站项目都在一个明确统一的地方，所以可以在根目录创建web文件夹存放打包产物，并给予jenkins用户读写的权限。

mkdir web
sudo chown -R jenkins:jenkins /web

# 创建test文件夹存放当前这个测试项目的打包产物
cd web
mkdir test

然后回到Jenkins项目配置中，增加一个构建步骤，执行shell

cd /
rm -rf web/test/*
mv /var/lib/jenkins/workspace/FirstProject/dist/* web/test/

然后保存，点击立即构建即可把打包的产物移动到对应目录下。

最后简单补充配置下Nginx

server {
    listen 80;
    server_name test.somecat.cn;
    return 301 https://$host$request_uri;
}

server {
    listen 443 ssl;
    server_name test.somecat.cn;

    ssl_certificate /etc/letsencrypt/live/somecat.cn/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/somecat.cn/privkey.pem;

    location / {
        root /web/test;
        try_files $uri $uri/ /index.html;
    }
}

保存后reload一下Nginx

sudo systemctl reload nginx

记得去域名服务商那把对应的子域名解析到我们的服务器公网IP，然后试着访问下：test.somecat.cn

image.png

🎆🎆🎆大功告成 💐💐💐

avatar
文章
阅读
粉丝