QR码扫描后JWT中'-'被替换为'''的原因及解决方案咨询

问题背景 #

我使用qrcodejs生成包含校验过的JWT令牌的QR码，原始令牌示例：

eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJ7XCJ0YXJqZXRhXCI6XCIqKioqNCoqKioqKioqKlwiLFwibm9tXCI6XCIqKioqKioqKioqKioqKlwifSIsImlhdCI6MTY4NjMwODcwODk5MX0.IajSQzRdC3PkxI4opTbwk-bqcCE-75z9whYQwt5Z2nFwVLGjHZRbTcjC1dy-jyTpPbVsWimQU96jxynopepCXQ

但扫描后发送到后端的令牌中，所有-都被替换成了'，示例：

eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJ7XCJ0YXJqZXRhXCI6XCIqKioqNCoqKioqKioqKlwiLFwibm9tXCI6XCIqKioqKioqKioqKioqKlwifSIsImlhdCI6MTY4NjMwODcwODk5MX0.IajSQzRdC3PkxI4opTbwk'bqcCE'75z9whYQwt5Z2nFwVLGjHZRbTcjC1dy'jyTpPbVsWimQU96jxynopepCXQ 

经测试，其他APP扫描可正常读取内容，说明问题出在扫描后发送至后端的环节，现针对以下两个问题解答：

1. 字符替换现象的原因 #

• 前端扫描结果处理逻辑错误：扫描QR码的页面或内置组件中，存在硬编码的字符串替换逻辑（比如误写了replace(/-/g, "'")），或者自定义的转义规则错误地将-识别为需要替换的字符。
• 第三方扫描SDK的bug：如果使用了第三方扫码组件，该组件内部的字符串处理模块可能存在缺陷，导致-被错误替换。
• 输入模拟异常：部分扫码组件通过模拟键盘输入填充内容，若设备或环境的键盘映射存在异常，可能将-识别为'，但这种情况概率极低（毕竟其他APP扫描正常）。

2. 解决该问题的最佳方案 #

优先方案：前端修复 #

• 排查并修正处理代码：找到扫描完成后处理结果的前端逻辑，检查是否存在错误的字符替换代码，直接移除或修正该逻辑。
• 简化转义流程：确保仅对JWT中需要转义的字符（如引号、反斜杠）进行处理，保留-、.、_等JWT合法字符。
• 替换可靠的扫描组件：若使用的第三方组件无法定位问题，可更换为成熟的扫码库，或使用浏览器原生扫码API（Web应用场景）。

临时备选：后端兼容修复 #

如果前端修复暂时无法落地，可在后端接收令牌时先做反向替换（仅作为临时 workaround，不推荐长期使用）：

// Node.js示例
const receivedToken = req.body.token.replace(/'/g, '-');
// 后续执行JWT解码验证逻辑

验证步骤 #

修复后，需确认扫描后的令牌与原始JWT完全一致，再测试后端解码流程是否正常，避免其他字符被意外修改。

内容的提问来源于stack exchange，提问作者Grismak