qrcode.js比QRCode.js更适合页面内分享，因其默认UTF-8编码、支持中文及带参链接，并提供scale/margin调节参数；需设宽高为偶数、URL先encodeURIComponent、确保DOM ready后再初始化；iOS微信导出PNG需防跨域污染、加crossOrigin="anonymous"并校验toDataURL返回值；分享链接需用decodeURIComponent(encodeURI(url))平衡编码层级；真机多版本扫码测试必不可少。
直接用 JavaScript 在前端生成二维码，比后端生成再请求更轻量、更实时——但必须注意 Canvas 渲染兼容性和扫码识别率这两个硬伤。
qrcode.js 为什么比 QRCode.js 更适合页面内分享
很多人搜到 QRCode.js 就直接上，结果发现不支持中文或生成的图模糊难扫。qrcode.js（小写 q 开头，作者是 davidshimjs）默认启用 UTF-8 编码，对中文 URL 或带参数的分享链接更友好；它还提供 scale 和 margin 参数，能避免生成过小或边缘被裁的码。
- 必须设
width和height为偶数（如200），否则某些安卓机型扫码失败 - 避免把
text直接传入长 URL 字符串，先用encodeURIComponent()处理一次 - 不要在
document.body还没 ready 时就调用new QRCode()，否则容器找不到会静默失败
Canvas 导出 PNG 时 iOS 微信不认怎么办
iOS 微信内置浏览器对 canvas.toDataURL('image/png') 的 MIME 类型校验极严，常见错误是返回 data:, 空字符串或扫码提示“无法识别”。根本原因是 canvas 跨域污染（哪怕本地资源也触发）或未设置 crossOrigin 属性。
- 如果二维码含图标（比如中间加 logo），必须确保 logo 图片设置了
crossOrigin="anonymous" - 导出前加判断：
if (canvas.toDataURL().indexOf('data:image') === 0) { ... }，否则直接 fallback 到 base64 图片标签渲染 - 微信内建议放弃下载按钮，改用长按识别——因为
saveAs或a[download]在 iOS 微信里基本无效
分享到微信/微博时链接被自动转义怎么破
用户点击“分享”按钮后，实际发出去的链接常变成 https%3A%2F%2Fexample.com%2Fshare%3Fid%3D123，导致目标页收不到原始参数。这不是二维码的问题，而是分享 SDK 对 URL 的二次 encode。
- 生成二维码前，对整个 URL 做一层
decodeURIComponent(encodeURI(url))平衡编码层级 - 微信 JS-SDK 的
updateAppMessageShareData中，link字段必须是服务端可访问的完整地址，不能是localhost或带端口的开发地址 - 微博分享若出现乱码，检查 meta 标签：
的值是否与二维码内容一致
真正卡住人的往往不是生成逻辑，而是二维码在不同手机型号+不同 App（尤其是微信旧版本、QQ 浏览器）里识别成功率差异极大；上线前至少拿三台真机（iOS 15/16、Android 12/13）扫 10 次以上，别信模拟器预览。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
