xinli/二维码功能修复说明.md

137 lines
5.5 KiB
Markdown
Raw Normal View History

# 二维码功能修复说明
## 修复时间
2025年1月
## 修复内容
### 一、修复快速生成接口404问题
**问题**快速生成注册和登录二维码时前端返回404错误。
**原因分析**
1. Spring Boot路径映射可能存在冲突
2. 路径变量 `/{qrcodeId}` 可能优先匹配 `/generate/register``/generate/login`
**修复方案**
1.`/generate/register``/generate/login` 方法移到其他 `/generate/*` 方法附近,保持一致性
2.`@PostMapping` 注解中添加 `produces = "application/json;charset=UTF-8"`,明确指定响应类型
3. 确保 `/{qrcodeId}` 路径变量方法放在所有具体路径之后
**修复后的接口路径**
- `POST /psychology/qrcode/generate/register` - 快速生成注册二维码
- `POST /psychology/qrcode/generate/login` - 快速生成登录二维码
### 二、修复二维码URL生成问题
**问题**生成的二维码URL使用后端地址和端口`http://1.15.149.240:30081`但前端页面运行在80端口导致手机扫码无法访问。
**修复方案**
1. 优化 `buildServerAddress()` 方法,优先从 `Referer` 头提取前端地址
2. 如果检测到后端端口30081自动改为前端端口80不显示端口号
3. 生成的二维码URL现在指向前端页面而不是后端API
**修复后的URL格式**
- 本地开发:`http://localhost/psychology/qrcode/scan/xxx`
- 生产环境:`http://1.15.149.240/psychology/qrcode/scan/xxx`
### 三、完善扫码跳转逻辑
**功能说明**
1. **扫码接口**`GET /psychology/qrcode/scan/{qrcodeCode}`(公开接口,使用 `@Anonymous` 注解)
2. **跳转地址映射**
- `test`(测评)→ `/psychology/assessment/start?scaleId={id}``/psychology/questionnaire/start?questionnaireId={id}`
- `view_report`(查看报告)→ `/psychology/report/detail?reportId={id}``/psychology/report/detail?assessmentId={id}`
- `register`(注册)→ `/register`
- `login`(登录)→ `/login`
3. **前端扫码页面**`scan.vue`
- 自动解析URL和查询参数
- 使用Vue Router进行内部跳转
- 支持完整URL的外部跳转
- 提供错误提示和重试机制
## 测试步骤
### 1. 重启后端服务
**重要**:修改代码后必须重启后端服务才能生效。
### 2. 测试快速生成功能
1. 登录管理系统
2. 进入"二维码管理"页面
3. 点击"快速生成" → "注册二维码"
4. 应成功生成二维码并显示预览
5. 点击"快速生成" → "登录二维码"
6. 应成功生成二维码并显示预览
### 3. 测试二维码扫码功能
1. 使用手机扫描生成的二维码
2. 应能正常打开扫码页面(`/psychology/qrcode/scan/{qrcodeCode}`
3. 根据二维码类型自动跳转到对应页面:
- 注册二维码 → 跳转到注册页面
- 登录二维码 → 跳转到登录页面
- 测评二维码 → 跳转到测评开始页面
- 报告二维码 → 跳转到报告详情页面
### 4. 检查二维码URL
生成的二维码URL应该
- 使用前端地址80端口而不是后端地址30081端口
- 格式为:`http://{host}/psychology/qrcode/scan/{qrcodeCode}`
- 手机可以正常访问
## 关键代码位置
### 后端
- **Controller**`ry-xinli-admin/src/main/java/com/ddnai/web/controller/psychology/PsyQrcodeController.java`
- `generateRegisterQrcode()` - 快速生成注册二维码
- `generateLoginQrcode()` - 快速生成登录二维码
- `scan()` - 扫码接口
- `buildServerAddress()` - 构建服务器地址
- `buildRedirectUrl()` - 构建跳转地址
- **Service**`ry-xinli-system/src/main/java/com/ddnai/system/service/impl/psychology/PsyQrcodeServiceImpl.java`
- `generateQrcode()` - 生成二维码Base64
- `buildQrcodeContent()` - 构建二维码内容URL
### 前端
- **API**`xinli-ui/src/api/psychology/qrcode.js`
- `generateRegisterQrcode()` - 调用快速生成注册二维码接口
- `generateLoginQrcode()` - 调用快速生成登录二维码接口
- `scanQrcode()` - 调用扫码接口
- **页面**
- `xinli-ui/src/views/psychology/qrcode/index.vue` - 二维码管理页面
- `xinli-ui/src/views/psychology/qrcode/scan.vue` - 扫码页面
- **路由**`xinli-ui/src/router/index.js`
- `/psychology/qrcode/scan/:qrcodeCode` - 扫码页面路由
- `/register` - 注册页面路由
- `/login` - 登录页面路由
## 注意事项
1. **必须重启后端服务**:修改代码后必须重启后端服务才能生效
2. **权限检查**:快速生成接口需要 `psychology:qrcode:add` 权限
3. **扫码接口**:扫码接口使用 `@Anonymous` 注解,不需要登录即可访问
4. **URL生成**二维码URL会根据请求的 `Referer` 头自动识别前端地址
5. **端口配置**前端运行在80端口后端运行在30081端口
## 如果仍有问题
1. **检查后端日志**:查看是否有路径映射错误或权限错误
2. **检查浏览器控制台**查看实际请求的URL和错误信息
3. **检查网络请求**在浏览器开发者工具的Network面板中查看请求详情
4. **确认服务状态**确保后端服务已正确启动并运行在30081端口
5. **确认权限**:确保当前用户有 `psychology:qrcode:add` 权限
## 修复完成
所有二维码相关功能已修复完成,包括:
- ✅ 快速生成注册二维码
- ✅ 快速生成登录二维码
- ✅ 二维码URL生成指向前端页面
- ✅ 扫码跳转功能
- ✅ 测评二维码扫码
- ✅ 报告二维码扫码