Files
eSIM-Tools/docs/reference/README_giffgaff_esim.md
Abner ad16472fad 📝 docs: 全面审查并修复项目文档质量
- 重构 ARCHITECTURE.md,拆分未来架构到独立文件,修复 TypeScript 伪代码
- 修正 CLAUDE.md 模块结构图路径与实际代码一致
- 统一 README 中英文版快速开始步骤,补充环境变量配置
- 修复 TOKEN_REFRESH_FIX.md 未声明变量错误
- 统一修复文档格式模板,更新 reference 文件引用路径
- 优化 CORS_SOLUTION.md 标题语义和安全建议
- 补充 SECURITY.md CSP 配置上下文说明
- 调整 User_Guide.md 视频位置,补充扫码安装步骤
2026-05-19 19:30:37 +08:00

2.6 KiB
Raw Blame History

Giffgaff eSIM 工具 - 技术参考

基于 Giffgaff-swap-esim.json Postman 脚本构建的完整 eSIM 设备更换网页工具。

📁 文件说明

主要文件

  • src/giffgaff/giffgaff_modular.html - eSIM 设备更换工具(生产版本,模块化架构)
  • tests/test_giffgaff_esim.html - 综合测试页面(开发/测试版本)

参考文件

  • postman/giffgaff.html - 原始单文件版本(参考)
  • postman/Giffgaff-swap-esim.json - 原始 Postman 脚本

🔧 技术架构

前端技术栈

  • HTML5 - 语义化结构
  • CSS3 - 响应式设计Bootstrap 5.3.0
  • JavaScript (ES6+) - 现代 JavaScript 特性
  • Font Awesome 6.0.0 - 图标库

API 集成

  • OAuth 2.0 PKCE - 安全认证流程
  • Giffgaff ID API - 用户认证和 MFA
  • Giffgaff GraphQL API - 业务逻辑处理
  • QR Code API - 二维码生成服务(优先 https://qrcode.show/,备选 quickchart.iochart.googleapis.com

关键 API 端点

const apiEndpoints = {
    mfaChallenge: "https://id.giffgaff.com/v4/mfa/challenge/me",
    mfaValidation: "https://id.giffgaff.com/v4/mfa/validation",
    graphql: "https://publicapi.giffgaff.com/gateway/graphql",
    qrcode: "https://qrcode.show/"
};

📝 开发说明

核心组件架构

// 全局状态管理
const appState = {
    accessToken: "",      // OAuth 访问令牌
    codeVerifier: "",     // PKCE 代码验证器
    emailCodeRef: "",     // 邮件验证引用
    emailSignature: "",   // MFA 签名
    memberId: "",         // 会员 ID
    esimSSN: "",         // eSIM 序列号
    lpaString: "",        // LPA 下载字符串
    currentStep: 1        // 当前步骤
};

主要函数说明

  • generateCodeVerifier() - 生成 PKCE 代码验证器
  • generateCodeChallenge() - 生成 PKCE 代码挑战
  • showSection(stepNumber) - 显示指定步骤
  • showStatus(element, message, type) - 显示状态信息
  • generateQRCode(data) - 生成二维码

GraphQL 查询示例

# 获取会员信息
query getMemberProfileAndSim {
    memberProfile {
        id
        memberName
        __typename
    }
    sim {
        phoneNumber
        status
        __typename
    }
}

# 预订 eSIM
mutation reserveESim($input: ESimReservationInput!) {
    reserveESim: reserveESim(input: $input) {
        id
        esim {
            ssn
            activationCode
            __typename
        }
        __typename
    }
}

文档版本: 1.1.0 最后更新: 2026-05-18 维护者: eSIM Tools Team