Github地址

- [前端地址](https://github.com/BunnyMaster/bunny-admin-web.git)
- [后端地址](https://github.com/BunnyMaster/bunny-admin-server)

Gitee地址

- [前端地址](https://gitee.com/BunnyBoss/bunny-admin-web)
- [后端地址](https://gitee.com/BunnyBoss/bunny-admin-server)

# 项目特点

前端项目基于[pure-admin](https://github.com/pure-admin/pure-admin-thin)
开源项目进行了改进和优化，RBAC（基于角色的访问控制）。在我项目中，后端负责验证请求地址的访问权限。

整个项目都采用响应式设计，可以兼容移动设备，除了表格显示在移动端可能不够友好外，其他方面表现良好。由于表格本身具有一定的复杂性，手机上查看效果可能不理想，目前无法对其进行修改。

![image-20241026032407486](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026032407486.png)

## 登录内容

登录可以选择用户名和密码登录或者是邮箱方式登录

![image-20241028090631003](http://116.196.101.14:9000/docs/auth/undefinedimage-20241028090631003.png)

![image-20241028090646664](http://116.196.101.14:9000/docs/auth/undefinedimage-20241028090646664.png)

## 1. 首页定制

提供了自定义首页的功能，可以根据个人喜好替换首页内容。我将首页设计成类似Git提交的内容，以便更直观地查看信息。

## 2. 系统设置

系统设置包含基本的权限管理配置。

### 系统菜单管理

系统菜单管理功能允许您快速调整菜单内容的排序、显示和隐藏。删除功能采用逻辑删除，菜单名称通常与路由名称相同。如果菜单名称重复，系统会跳转至最后一个具有相同名称的路径，因此请确保菜单名称的唯一性。

系统菜单图标支持动态图标。

![image-20241026025901761](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026025901761.png)

在添加外链时，路由名称即为外链地址。

![image-20241026025825052](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026025825052.png)

### 用户管理

筛选条件和部门筛选可以同时进行选择。

其中系统中有一个默认用户是不会在前台用户进行展示的`Administrator`这个用户是系统预留，以防出错或维护使用

![image-20241026030000099](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026030000099.png)

### 角色权限管理

权限管理中的权限添加支持树型结构。

![image-20241026030034998](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026030034998.png)

![image-20241026030057212](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026030057212.png)

在新增权限时，请求地址可以是正则表达式或者Java中的antpath，两者皆可兼容。

![image-20241026030247782](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026030247782.png)

部门管理同样采用树型结构。

![image-20241026030105402](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026030105402.png)

## 3. 系统配置

### 菜单图标

![image-20241026030355125](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026030355125.png)

### 邮件用户配置

发送验证码时，若未配置用户默认值，则会使用默认地址发送。若默认地址也未配置，则会提示未设置默认邮箱用户。

默认选项最终只有一个。

其中默认选项无论有多少用户最终默认的只会有一个

![image-20241026030534421](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026030534421.png)

### 邮件模板

第一个是发送验证码邮件模板

![image-20241026030557224](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026030557224.png)

### 前端页面配置

因为这个模板作者将配置选项放在了前端文件中的`public`文件夹下， 配置选项现已变为动态，交给后端管理

![image-20241026030621707](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026030621707.png)

## 4. 系统监控

### 服务监控

查看当前服务的CPU占用情况，使用SpringBoot中的`actuator`端点。图表每2秒请求一次，页面兼容移动设备。

![image-20241026031050902](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031050902.png)

### 后台文件管理

![image-20241026031117116](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031117116.png)

### 用户登录日志

![image-20241026031206836](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031206836.png)

### 任务执行日志

使用任务调度时执行状态都会记录在这个里面

![image-20241026031240109](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031240109.png)

### 系统缓存

项目中使用了SpringCache，如果请求的内容可以缓存在SpringCache中

![image-20241026031252429](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031252429.png)

## 5. 定时任务

![image-20241026031339987](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031339987.png)

![image-20241026031346612](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031346612.png)

## 6. 多语言

![image-20241026031403524](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031403524.png)

![image-20241026031411689](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031411689.png)

## 外部页面

![image-20241026031448707](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031448707.png)

# 环境部署

使用Docker进行部署，后端接口地址以`/admin`开头，但前端默认请求前缀为`/api`，因此在请求时需要进行替换。详细内容请参考以下【项目部署】说明。

## 配置相关

### docker文件

```dockerfile
# 使用官方的 Nginx 镜像作为基础镜像
FROM nginx

# 删除默认的 Nginx 配置文件
RUN rm /etc/nginx/conf.d/default.conf

# 将自定义的 Nginx 配置文件复制到容器中
COPY nginx.conf /etc/nginx/conf.d/default.conf

# 设置时区，构建镜像时执行的命令
RUN ln -sf /usr/share/zoneinfo/Asia/Shanghai /etc/localtime
RUN echo "Asia/Shanghai" > /etc/timezone

# 创建一个目录来存放前端项目文件
WORKDIR /usr/share/nginx/html

# 将前端项目打包文件复制到 Nginx 的默认静态文件目录
COPY dist/ /usr/share/nginx/html
# 复制到nginx目录下
COPY dist/ /etc/nginx/html

# 暴露 Nginx 的默认端口
EXPOSE 80

# 自动启动 Nginx
CMD ["nginx", "-g", "daemon off;"]
```

### NGINX文件

在请求中会使用代理所以会拿不到用户真实的IP地址，素以在要NGINX侠做下面的配置，这样用户在访问时就可以拿到真实的IP了

```nginx
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;
```

NGINX的文件

```nginx
map $http_upgrade $connection_upgrade {
    default upgrade;
    ''      close;
}

server {
    listen       80;
    listen       [::]:80;
    server_name  localhost;

    location / {
        root   /etc/nginx/html;
        index  index.html index.htm;
        try_files $uri /index.html;
    }

    # 后端跨域请求
    location ~/admin/ {
        proxy_pass http://172.17.0.1:8000;
        proxy_set_header Host $http_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;
    }

    error_page  404              404.html;

    location = /50x.html {
        root   html;
    }
}
```

## 项目部署

使用WebStorm进行项目部署，项目上线时默认端口为80。因此，Docker默认暴露的IP端口也应为80，NGINX中默认暴露的端口也是80，三者应一一对应。

若无法下载，请先使用pnpm下载。若不需使用pnpm，请删除或修改相应内容。

![image-20241026025057129](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026025057129.png)

### docker配置

![image-20241026024116090](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026024116090.png)

### 配置环境

设置启动端口号和项目地址机器后端请求地址

![image-20241026024813858](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026024813858.png)

#### 配置线上环境

设置项目启动端口号，线上环境默认请求路径为`/admin`，需在NGINX中将访问请求前缀更改为`/admin`。

![image-20241026024940747](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026024940747.png)

![image-20241026024243785](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026024243785.png)

#### 配置开发环境

开发环境默认IP为7000，若与本地项目端口冲突，请修改。后端请求地址为7070。

前端设置的请求前缀为`/api`，但后端接受的前缀为`/admin`，因此需在服务中修改此内容。

![image-20241026024318644](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026024318644.png)

**修改请求路径**

![image-20241026031651591](http://116.196.101.14:9000/docs/auth/undefinedimage-20241026031651591.png)

### 部署命令

```bash
docker build -f Dockerfile -t bunny_auth_web:1.0.0 . && docker run -p 80:80 --name bunny_auth_web --restart always bunny_auth_web:1.0.0
```

# 展望未来

1. 计划将文件上传服务改为本地的OSS，Minio可能会被移除。
2. 消息服务，管理员相关的消息公告内容