前后端CICD, GO编写minio存储文件服务 (一)

前后端CICD, GO编写minio存储文件服务 (一),第1张

前言

最近在用vue3写后台管理项目, 发现花裤衩PanJiaChen的vue-element-admin源码还停在了vue2, 一咬牙索性就自己厚着脸皮用vue3+vite2+pinia按照源码重写一下. 写起来还算简单, 没什么技术含量, 就不乱介绍科普了. 有兴趣的可以去看大佬之前写的教程 [传送门]. 重写的代码将会做为存储文件服务的管理端, 嫌麻烦不想自己写代码的可以下载代码跟着本文一步一步做测试.

代码↓:

Github
前端 https://github.com/guangnaoke/vue3-admin
Go https://github.com/guangnaoke/go-minio

Gitee
前端 https://gitee.com/Xiao_Yi_Zhou/vue3-admin.git
Go https://gitee.com/Xiao_Yi_Zhou/go-minio.git

第二部分的链接: 前后端CI/CD, GO编写minio存储文件服务 (二)

配置报错

jest

解决方法:

jest.config.js

// 任选其一, 我是第一个方法解决的
transformIgnorePatterns: ['!node_modules/']
// transformIgnorePatterns: [`/node_modules/(?!${esModules})`]

vite

run dev不会报错, build时候报错.

解决方法:

vite.config.js

// VITE_APP_PROXY_DOMAIN_REAL, 是.env文件的定义的属性.
define: {
  'process.env': {
    APP_DOMAIN: VITE_APP_PROXY_DOMAIN_REAL
  }
}
xxx.js
// import.meta报错, 就自定义一个方法.

export const appDomain =
  process.env.NODE_ENV === 'development' ? '' : process.env.APP_DOMAIN

vite-plugin-mock

开始以为是node的esbuild报错, 逐尝试 node node_modules/esbuild/install.js 无果.

解决方法:

node node_modules/vite-plugin-mock/node_modules/esbuild/install.js

印象比较深就这几个, 有新的在来更新. 算是一个错误总结吧. 如果各位有更好的解决方法, 麻烦评论告诉我, 谢谢!

接下来, 活动活动下你的小手, 直接开整!

安装

如果你不用docker来安装下面这些应用, 而是直接安装的话, 你可以直接忽略关于docker的细节, 其他部分安装基本上是一致的.

安装docker到你的服务器(或者虚拟机), 这个网上很多教程.

docker安装Jenkins

docker pull jenkinsci/blueocean

docker run \
 -d \
 -u root \
 -p 8080:8080 \
 --name jenkins \
 --restart=always \
 -v /www/jenkins:/var/jenkins_home \
 -v /var/run/docker.sock:/var/run/docker.sock \
 -v /etc/localtime:/etc/localtime:ro \
 -e JENKINS_OPTS="--prefix=/jenkins" \
 -e JENKINS_ARGS="--prefix=/jenkins" \
 -e TZ="Asia/Shanghai" \
 jenkinsci/blueocean:latest

-d 【容器后台运行】
-p 【端口】
–name 【容器名称】
–restart always 【docker重启后,自动重启容器.】
-v /www/jenkins:/var/jenkins_home 【配置目录映射到本机】
-v /var/run/docker.sock:/var/run/docker.sock 【将主机的docker映射到容器内】
-v /etc/localtime:/etc/localtime:ro 【保持容器时间与主机时间一致】
-e JENKINS_OPTS="–prefix=/jenkins"
-e JENKINS_ARGS="–prefix=/jenkins"
【如果是 http://127.0.0.1:8080/jenkis 访问, 需要设置上面两个 -e, http://127.0.0.1:8080 直接访问则不需要加.】
-e TZ=“Asia/Shanghai” 【时区】

127.0.0.1 替换成你的ip地址

运行后访问 http://127.0.0.1:8080/jenkins.

回到控制台输入

docker logs 容器id

中间的那串码就是密码

*************************************************************
*************************************************************
*************************************************************

Jenkins initial setup is required. An admin user has been created and a password generated.
Please use the following password to proceed to installation:

546b79bd427544699725962978dc4339

This may also be found at: /var/jenkins_home/secrets/initialAdminPassword

*************************************************************
*************************************************************
*************************************************************

选推荐就好

后面几步的都挺简单的, 创建账号密码, 保存完成下一步就ok.

进到jenkins首先安装一些要用的插件

选择可选插件, 然后再右边的搜索框搜索.

依次安装


代码仓库看着选

Gitee

Github

后面的WebHooks例子我就以国内的Gitee为例.

安装好后重启下jenkins, 安装页面有提示重启. 如果没有, 可以地址栏后面加个restart.

配置工具

设置下全局工具.

NodeJS选择自己要的版本.

去容器内设置下SSH, 当然你也可以设置全局工具配置.

docker exec -it 容器id /bin/bash

接下来就是敲几个命令

ssh-keygen -t ed25519 -C "xxxxx@xxxxx.com" 
cat ~/.ssh/id_ed25519.pub
# ssh-ed25519 AAAAB3NzaC1yc2EAAAADAQABAAABAQC6eNtGpNGwstc....

‘#’ 后面的就是公钥, 添加到SSH管理

如果不会, 参考:https://gitee.com/help/articles/4181#article-header0

创建任务

建个测试用的仓库

git clone 到本地, 然后创建个jenkinsfile文件,注意大小写. 内容如下

pipeline {
  agent any
  stages {
    stage('Build') {
      steps {
        sh 'echo "Building...!"'
      }
    }
    stage('Test') {
      steps {
        sh 'echo "Testing...!"'
      }
    }
  }
}

接着去jenkins创建任务

到Gitee Webhook这里勾选

在拉到下面生成下密码

然后去Gitee设置WebHooks, 将上面的URL和密码分别填入, 点击确定.

回到jenkins的任务面设置最后一步, 将git地址填进去, 上面我们设置了SSH, 所以Credentials这里可以选’无’, 没有设置SSH但是设置了全局工具的可以直接选你创建好的key.

最后注意下你的jenkinsfile大小写, 对应你项目里的文件名.

点击保存完成设置.

测试

将改动后的项目push到仓库, 看jenkins任务是否正常启动了.

测试成功

接下来可以拿文章开头的链接去仓库拉取代码, 当然你可以用你自己的项目进行测试.

一般我会将测试和部署分开执行的, 并不会合拢到一个流水线. 测试任务一般是推送代码的时候触发, 部署任务因为要考虑发布环境、版本号、推送镜像等等, 会采用手动设置参数构建. 当然整个过程也只是输入一些参数, 容器创建部署都是自动的.

测试任务跟前面的创建任务步骤一样, jenkinsfile文件已经在项目的根目录, 就不重复这个过程了.

接下来创建部署任务

添加参数, 选择字符参数, 可以设置一些版本号、容器名字、发布的环境等字符.

这里和测试任务一样.

选择NodeJS环境, 版本号选择你全局工具设置的.

构建选择shell脚本

代码如下

# 进入工作区
cd $WORKSPACE

# 修改镜像源
npm config set registry https://registry.npmmirror.com

# 安装依赖
npm install

# 测试
npm run test

# 打包
npm run build

# docker通过 Dockerfile 打包, VERSION是你构建任务时要输入的版本号
docker build -t minio_web_client:$VERSION .

# 下面 stop rm 的 *** 作不是必须
docker stop minio_web_client || true

docker rm minio_web_client -f || true

# 启动容器
docker run -d -p 8083:8083 --name minio_web_client minio_web_client:$VERSION

# 有些镜像构建过程会产生:的垃圾镜像, 可以通过这个命令删除掉没有依赖的这类镜像.
# 有多个任务同时运行时, 慎用. 如果这个任务比其他的早结束, 会造成其他容器的依赖被删除, 导致报错.
docker rmi $(docker images -f "dangling=true" -q) || true

构建后的 *** 作, 比如成功或者失败给你发Email之类的就不介绍了, 有需求的自己琢磨下.

设置完点击保存.

回到项目文件, 然后在根目录创建一个Dockerfile文件, 代码如下

FROM node:16.13.0-stretch-slim

# 创建/app /app/dist 文件夹
RUN mkdir -p /app/dist

# 切换到app文件夹
WORKDIR /app

# 下面两个ADD *** 作将server静态服务器与打包好的项目文件复制到对应的文件夹
ADD ./server /app

ADD ./build /app/dist

# 创建package.json等文件
RUN npm init -y

# 设置镜像源
RUN npm config set registry https://registry.npmmirror.com

# 安装依赖
RUN npm install koa@2.13.4 koa-static@5.0.0

# 静态服务器端口号
EXPOSE 8083

# 执行命令
CMD [ "node", "index.js" ]

在根目录创建server文件夹,新建index.js文件, 用来构建一个简单的静态服务, 代码如下:

// 使用dockerfile构建静态服务器

const Koa = require('koa')
const koaStatic = require('koa-static')
const app = new Koa()

const static = koaStatic('./dist')

app.use(static)

app.listen(8083)

回到jenkins, 点击构建任务

输入版本号开始构建

等待任务跑完…

如果构建成功的话, 在终端输入: docker images, 会发现多了一个minio_web_client的镜像

继续输入: docker ps, 发现镜像已经启动运行了.

这时候去浏览器地址访问: htttp://127.0.0.1(替换地址):8083 应该可以访问到部署的项目了.

docker安装Nginx

不需要反向代理的, 到这里这篇文章就结束了, 感谢阅读!

先在服务器的/usr文件夹下建立Nginx目录和所需的配置文件, 如果没有的话, 在跑容器的时候很有可能跑不起来.

创建目录(linux为例)

mkdir /usr/nginx/html -p
mkdir /usr/nginx/conf/conf.d -p
mkdir /usr/nginx/logs -p

上面创建的目录是docker将来要挂载到你本地的目录.

docker pull nginx:1.20
docker run -p 80:80 nginx:1.20
docker cp 容器id:/etc/nginx/conf.d/default.conf /usr/nginx/conf/conf.d
docker cp 容器id:/etc/nginx/nginx.conf /usr/nginx/nginx.conf
docker stop 容器id
docker rm 容器id

配置文件可以先运行一个临时的nginx容器获取, 用完记得删除. 自己选择要安装的Nginx版本.

拿完配置文件后正式启动容器

docker run -d \
-p 80:80 \
--name nginx \
--restart=always \
-v /usr/nginx/html:/usr/share/nginx/html \
-v /usr/nginx/conf/nginx.conf:/etc/nginx/nginx.conf \
-v /usr/nginx/conf/conf.d:/etc/nginx/conf.d \
-v /usr/nginx/logs:/var/log/nginx \
-e TZ=Asia/Shanghai \
nginx:1.20

-d 【容器后台运行】
-p 【端口】
-v 【要挂载的目录,nginx.conf配置文件映射到本地后,修改nginx配置的时候就很方便.】
–name 【容器名称】
–restart always 【docker重启后,自动重启容器.】
-e TZ=Asia/Shanghai 【时区】

容器运行起来后, 进入创建的挂载目录找到conf.d下面的default.conf, 当然你也可以创建一个conf, 这个目录下的conf文件都会被加载进去.

修改配置文件:

# 127.0.0.1 替换成你自己的地址
upstream jenkins {
	server 127.0.0.1:8080;
}
upstream minio_web_client {
	server 127.0.0.1:8083;
}

server {
    listen       80;
    server_name  127.0.0.1;

    # To allow special characters in headers
    ignore_invalid_headers off;

    # Allow any size file to be uploaded.
    # Set to a value such as 1000m; to restrict file size to a specific value
    client_max_body_size 0;
    
    # To disable buffering
    proxy_buffering off;

    location ^~ /jenkins/ {
      proxy_pass http://jenkins;
      proxy_http_version 1.1;

      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;
      proxy_max_temp_file_size 0;

      #this is the maximum upload size
      client_max_body_size       10m;
      client_body_buffer_size    128k;

      proxy_connect_timeout      90;
      proxy_send_timeout         90;
      proxy_read_timeout         90;
      proxy_buffering            off;
    }
    
    location ^~ /minioclient/ {
      proxy_pass http://minio_web_client/;
    }

    # redirect server error pages to the static page /50x.html
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

配置完后, 你可以重启Nginx的容器:

docker restart 容器id

或者进到容器里面重新Nginx:

docker exec -it 容器id /bin/bash
cd /etc/nginx
nginx -t
nginx -s reload

浏览器输入不带端口的地址:

jenkins http://127.0.0.1(地址替换)/jenkins

web http://127.0.0.1(地址替换)/minioclient

看是否能正常访问了.

这里主要是做了一个反向代理, 让jenkins和web可以通过不带端口访问.

感谢阅读, 如果哪里有错误或者疑问麻烦评论告诉我, 我会及时修改的,谢谢!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/langs/990547.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-21
下一篇 2022-05-21

发表评论

登录后才能评论

评论列表(0条)

保存