🐛 fix: 修复 Session 恢复后二维码和 LPA 不显示的问题

问题:
- 用户完成 eSIM 激活后,因外部二维码服务不可用导致页面空白
- Session 恢复时未调用 showESimResult() 显示二维码和 LPA 信息

解决方案:
1. 新增通用二维码生成模块 (src/js/modules/qrcode-generator.js)
   - 实现三层降级策略:本地 CDN → 后端 Function → 文本提示
   - 消除对外部服务的依赖,提升隐私保护

2. 新增后端 Function (netlify/functions/qrcode-generate.js)
   - POST /bff/qrcode-generate 接口
   - 返回 base64 编码的 PNG 二维码
   - withAuth 中间件保护 + 输入验证

3. 重构前端二维码生成逻辑
   - Giffgaff/Simyo 统一使用 generateQRCodeWithFallback()
   - 保留并发调用防护和 tooltip 交互
   - 使用 i18n 翻译替代硬编码错误提示

4. 修复 Session 恢复逻辑
   - 在 handleSessionRestore() 中调用 showESimResult()
   - 确保刷新页面后二维码和 LPA 正常显示

技术改进:
- 懒加载 qrcode.js(~13KB gzip),仅在首次调用时加载
- 完整的测试覆盖(前端单元测试 + 后端安全测试)
- 更新 BFF 路由配置(Edge Function + 本地开发服务器)

Closes #75
This commit is contained in:
Abner
2026-06-13 19:20:22 +08:00
parent 4a7e842d40
commit f5c5dee5ab
12 changed files with 775 additions and 222 deletions

View File

@@ -103,6 +103,7 @@ const giffgaffTokenExchange = require('./netlify/functions/giffgaff-token-exchan
const verifyCookie = require('./netlify/functions/verify-cookie');
const giffgaffSmsActivate = require('./netlify/functions/giffgaff-sms-activate');
const autoActivateEsim = require('./netlify/functions/auto-activate-esim');
const qrcodeGenerate = require('./netlify/functions/qrcode-generate');
const publicConfig = require('./netlify/functions/public-config');
// 包装Netlify Functions为Express路由
@@ -157,6 +158,7 @@ const functionRoutes = [
['verify-cookie', verifyCookie],
['giffgaff-sms-activate', giffgaffSmsActivate],
['auto-activate-esim', autoActivateEsim],
['qrcode-generate', qrcodeGenerate],
['public-config', publicConfig]
];
app.locals.bffRoutes = functionRoutes.map(([name]) => `/bff/${name}`);