uni-app如何实现小程序端的动态二维码生成与分享

小程序端无法前端生成带scene参数的小程序码，必须调用微信服务端接口；前端仅可生成普通二维码，真小程序码需后端用appid/secret请求微信API返回base64供image组件显示。

小程序端的动态二维码生成，前端只能做普通二维码（URL 或文本），带 scene 的小程序码必须走微信服务端接口——这是硬性限制，绕不过。

为什么不能在小程序前端直接生成带参数的小程序码

微信明确禁止前端调用 /wxa/getwxacodeunlimit 等接口：它要求 appid 和 secret 严格保密，且请求必须携带合法 access_token。前端暴露密钥会直接导致账号被盗、小程序被封。

• 你在 H5 或 App 端看到的“扫码跳小程序”，本质是跳 https://wxaurl.cn/xxx 这类短链，不是真小程序码
• 真小程序码（太阳码/二维码）含加密签名，只允许服务端生成并返回 base64 或文件流
• uni-app 的 uni.navigateToMiniProgram 是跳已安装的小程序，不生成码

前端能做的唯一可靠路径：调后端 API 拿 base64

你只需在页面里发一个请求，拿到后端返回的 base64 字符串，直接赋给 <image :src="qrCodeUrl"> 即可显示。关键点如下：

• 后端必须用 responseType: 'arraybuffer' 请求微信接口，再用 Buffer.from(res.data).toString('base64') 转成 base64
• 前端请求时传参如 { uid: this.userId, channel: 'share' }，后端拼进 scene 字段（注意：最多 32 个可见字符）
• 若需长参数（如带 token 的完整 path），后端应先存入数据库或缓存，用短 ID 作 scene，扫码后再重定向
• 别自己拼 data:image/png;base64,... 前缀——uni-app 的 <image> 组件原生支持 base64，直接传字符串就行

普通二维码（非小程序码）可用 uqrcodejs 快速生成

如果业务只要扫出来跳 H5 页面或展示文本（比如分享活动页、电子名片），用 uqrcodejs 完全够用，且三端一致：

• 安装命令必须是：npm install uqrcodejs --save（包名易错，不是 uQRCode 或 qrcode）
• 导入写法必须是：import uQRCode from 'uqrcodejs'（ESM 导出，不支持 require）
• 中文内容务必提前 encodeURIComponent()，否则 H5 端扫码跳转会乱码
• text 只接受字符串，对象得自己 JSON.stringify()，不然输出 [object Object]
• 生成时机卡在 onReady 或 $nextTick，否则 canvas 元素未挂载会失败

容易被忽略的细节：尺寸、白边与容错率

很多人设了 width: 200 却扫不出，问题不在内容长度，而在参数误配：

• width 是最终画布宽高（px），size 才是每个模块的像素大小；默认 size: 4 在 200px 下太密，推荐 width: 280, size: 6
• margin 别设为 0——至少留 4px 白边，否则部分扫码器（尤其是微信内置）识别失败
• 容错等级必须设 errorCorrectLevel: 'H'，尤其当内容含大小写字母+数字混合时
• 小程序端返回的是 tempFilePath，H5 返回的是 base64，但都能直接塞进 <image :src="..."/>