环境搭建

进入Vmare,打开虚拟机

配置一键启动环境

1

vim ~/.bashrc

#增加如下内容
alias dps='docker ps --format "table{{.ID}}\t{{.Names}}\t{{.Status}}\t{{.Ports}}"'
#保存退出

#生效
source ~/.bashrc

访问http://192.168.150.101:10880/

image-20240701152638944

配置本机hosts

2

192.168.150.101 git.sl-express.com
192.168.150.101 maven.sl-express.com
192.168.150.101 jenkins.sl-express.com
192.168.150.101 auth.sl-express.com
192.168.150.101 rabbitmq.sl-express.com
192.168.150.101 nacos.sl-express.com
192.168.150.101 neo4j.sl-express.com
192.168.150.101 xxl-job.sl-express.com
192.168.150.101 eaglemap.sl-express.com
192.168.150.101 seata.sl-express.com
192.168.150.101 skywalking.sl-express.com
192.168.150.101 api.sl-express.com
192.168.150.101 admin.sl-express.com

打开浏览器测试

image-20240701153057560

名称 地址 用户名/密码 端口
git http://git.sl-express.com/ sl/sl123 10880
maven http://maven.sl-express.com/nexus/ admin/admin123 8081
jenkins http://jenkins.sl-express.com/ root/123 8090
权限管家 http://auth.sl-express.com/api/authority/static/index.html admin/123456 8764
RabbitMQ http://rabbitmq.sl-express.com/ sl/sl321 15672
MySQL - root/123 3306
nacos http://nacos.sl-express.com/nacos/ nacos/nacos 8848
neo4j http://neo4j.sl-express.com/browser/ neo4j/neo4j123 7474
xxl-job http://xxl-job.sl-express.com/xxl-job-admin admin/123456 28080
EagleMap http://eaglemap.sl-express.com/ eagle/eagle 8484
seata http://seata.sl-express.com/ seata/seata 7091
Gateway http://api.sl-express.com/ - 9527
admin http://admin.sl-express.com/ - 80
skywalking http://skywalking.sl-express.com/ - 48080
Redis - 123321 6379
MongoDB - sl/123321 27017
配置本地MAVEN

image-20240701154129648

<?xml version="1.0" encoding="UTF-8"?>
<settings
        xmlns="http://maven.apache.org/SETTINGS/1.0.0"
        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:schemaLocation="http://maven.apache.org/SETTINGS/1.0.0 http://maven.apache.org/xsd/settings-1.0.0.xsd">

    <!-- 本地仓库  这里要改成你自己的本地仓库位置 -->
    <localRepository>F:\maven\repository</localRepository>

    <!-- 配置私服中deploy的账号 -->
    <servers>
        <server>
            <id>sl-releases</id>
            <username>deployment</username>
            <password>deployment123</password>
        </server>
        <server>
            <id>sl-snapshots</id>
            <username>deployment</username>
            <password>deployment123</password>
        </server>
    </servers>

    <!-- 使用阿里云maven镜像,排除私服资源库 -->
    <mirrors>
        <mirror>
            <id>mirror</id>
            <mirrorOf>central,jcenter,!sl-releases,!sl-snapshots</mirrorOf>
            <name>mirror</name>
            <url>https://maven.aliyun.com/nexus/content/groups/public</url>
        </mirror>
    </mirrors>

    <profiles>
        <profile>
            <id>sl</id>
            <!-- 配置项目deploy的地址 -->
            <properties>
                <altReleaseDeploymentRepository>
                    sl-releases::default::http://maven.sl-express.com/nexus/content/repositories/releases/
                </altReleaseDeploymentRepository>
                <altSnapshotDeploymentRepository>
                    sl-snapshots::default::http://maven.sl-express.com/nexus/content/repositories/snapshots/
                </altSnapshotDeploymentRepository>
            </properties>
            <!-- 配置项目下载依赖的私服地址 -->
            <repositories>
                <repository>
                    <id>sl-releases</id>
                    <url>http://maven.sl-express.com/nexus/content/repositories/releases/</url>
                    <releases>
                        <enabled>true</enabled>
                    </releases>
                    <snapshots>
                        <enabled>false</enabled>
                    </snapshots>
                </repository>
                <repository>
                    <id>sl-snapshots</id>
                    <url>http://maven.sl-express.com/nexus/content/repositories/snapshots/</url>
                    <releases>
                        <enabled>false</enabled>
                    </releases>
                    <snapshots>
                        <enabled>true</enabled>
                    </snapshots>
                </repository>
            </repositories>
        </profile>
    </profiles>

    <activeProfiles>
         <!-- 激活配置 -->
        <activeProfile>sl</activeProfile>
    </activeProfiles>

</settings>

配置本地jdk环境

image-20240701154914165

拉取导入项目

image-20240701160844697

更新MAVEN并运行

image-20240701160927514

访问http://127.0.0.1:18099/doc.html#/home

image-20240701160958249

数据测试

image-20240701161211283

创建分支

使用git

11

12

创建成功

13

添加测试案例

14

测试成功

15

提交到远程仓库

16

17

可以看到代码已经提交

创建分支release-1.0

完善代码

18

将代码进行提交

19

创建tag并发布

20

21

Jenkins配置

访问Jenkins,通过root/123登录

进入页面创建任务

任务名称一般为项目名称

image-20240702170320182

填写描述

image-20240702170535472

设置构建参数

image-20240702170628580

版本号设置

image-20240702170644866

服务IP设置

image-20240702170658799

端口设置

image-20240702170712268

服务名称设置

image-20240702170833629

Git源码路径、账号、分支设置

image-20240702170922389

SSH连接地址、权限提升以及Maven版本设置

image-20240702170958123

Shell命令执行

image-20240702171041934

#!/bin/bash
# 微服务名称
SERVER_NAME=${serverName}
# 服务版本
SERVER_VERSION=${version}
# 服务端口
SERVER_PORT=${port}
# 源jar名称,mvn打包之后,target目录下的jar包名称
JAR_NAME=$SERVER_NAME-$SERVER_VERSION
# jenkins下的目录
JENKINS_HOME=/var/jenkins_home/workspace/$SERVER_NAME
#进入jenkins目录
cd $JENKINS_HOME
# 修改文件权限
chmod 755 target/$JAR_NAME.jar
#输出docker版本
docker -v
echo "---------停止容器($SERVER_NAME)---------"
docker stop $SERVER_NAME
echo "---------删除容器($SERVER_NAME)---------"
docker rm $SERVER_NAME
echo "---------删除镜像($SERVER_NAME:$SERVER_VERSION)---------"
docker rmi $SERVER_NAME:$SERVER_VERSION
echo "---------构建新镜像($SERVER_NAME:$SERVER_VERSION)---------"
docker build -t $SERVER_NAME:$SERVER_VERSION .
echo "---------运行服务---------"
docker run -d -p $SERVER_PORT:8080 --name $SERVER_NAME -e SERVER_PORT=8080 -e SPRING_CLOUD_NACOS_DISCOVERY_IP=${SPRING_CLOUD_NACOS_DISCOVERY_IP} -e  SPRING_CLOUD_NACOS_DISCOVERY_PORT=${port} $SERVER_NAME:$SERVER_VERSION

保存后开始构建

image-20240702171224810

运行完成后测试:http://192.168.150.101:18099/doc.html#/home

image-20240703144256543

可以看到页面成功展示了

自动构建

想要实现代码推送到git中自动开始构建,需要分别到gogs和Jenkins中进行设置

gogs设置

http://git.sl-express.com/sl/sl-express-gitflow-web页面点击右上角仓库设置

选择管理Web钩子

添加gogs钩子

image

在Jenkins中也要设置钩子

进入配置

将Password设置为sl123与gogs中一致

image-20240703150058328

在git中点击测试推送

看看能否测试成功

image-20240703145630579

image-20240703150234941

业务实现

验证码功能

登录 git 服务,找到 sl-express-ms-web-manager 工程,拉取代码

验证码的实现方式有很多种,项目中我们通过hutool工具包中的验证码模块来实现

使用自定义验证码来实现

image-20240703165431842

具体实现

先创建分支develop

具体的业务实现是在com.sl.ms.web.manager.service.AuthService中完成

image-20240703165613131

@Override
public void createCaptcha(String key, HttpServletResponse response) throws IOException {
        //1. 生成验证码,指定宽、高、字符个数、干扰线数
        LineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(115, 38, 0, 10);
        //1.1 自己创建一个随机数范围,验证码为四位随机数
        String random = "123456789abcdefghijklmnopqrstuvwsyz";
        RandomGenerator randomGenerator = new RandomGenerator(random,4);
        lineCaptcha.setGenerator(randomGenerator);
        //1.2 获取生成的验证码值
        lineCaptcha.createCode();
        String Code = lineCaptcha.getCode();

        //2. 将验证码的值写入到redis,有效期为1分钟
        String redisKey = CAPTCHA_REDIS_KEY + key;
        this.stringRedisTemplate.opsForValue().set(redisKey, Code, Duration.ofMinutes(1));

        //输出到页面
        response.setHeader(HttpHeaders.PRAGMA, "No-cache");
        response.setHeader(HttpHeaders.CACHE_CONTROL, "No-cache");
        response.setDateHeader(HttpHeaders.EXPIRES, 0L);
        lineCaptcha.write(response.getOutputStream());
    }

在Controller中调用Service中的方法:

image-20240703165756274

测试

可以看到验证码

image-20240703165907670

部署前端

拉取project-slwl-admin-vue代码

修改.env.production.stu文件,设置前后端交互接口改为本机地址和端口:

image-20240704171035290

提交到git中,使用Jenkins部署

选择develop分支,开始构建

image-20240704171130051

访问地址进行测试:http://admin.sl-express.com/

image-20240704171240463

可以看到请求为200

image-20240704171414493

登录功能实现

AuthServiceImpl中完善代码

image-20240704174459771

image-20240704174515533

Controller中调用:

image-20240704174750039

测试

可以看到测试有数据

image-20240704174842874

权限管家

权限管家使用说明

改造登录接口为权限管家的接口

image-20240705150255954

测试

可以看到测试成功

image-20240705150518581