以csdn的微信登录为例子
1、发起请求,获取微信二维码的 QR code
这个请求一般返回两个字段
QR url ()
订单号 / token ()
然后通过 QR url 生成 QR code(二维码),用某个库去生成。
2、生成完二维码后,一直轮询后端,把第二个字段 订单号/token带上,后端返回状态确认是否已经扫了二维码,或者支付是否成功
全栈的微信(支付,登录)二维码的数据流是怎样的呢?
可以去看微信的开发者文档。 我这里先简单回忆一下。
后端通过 签名 app id 等 调用微信的api生成 二维码,然后发给前端。
前端一直轮询,等后端接收到了微信发过来的扫码成功信息后,给前端返回已扫码等信息。
--------------------------------------------------------
具体例子:
{
"codeUrl": "weixin://wxpay/bizpayurl?prepay_id=wx1219935b473f6e6ed567&package=193643\",
"tradeNo": "DHXWYCD-DP9HRQ" //订单号
}
这个字符串是微信支付中的一个链接,包含了用于进行移动端网页跳转的相关参数。具体来说:
mwebUrl
:表示该链接是为移动版(Mobile Web)而设计的; prepay_id
:表示预支付订单的ID,是微信支付凭证之一; package
:表示下一步所需要的支付相关信息,由商户向微信发送预支付请求时携带。
import QRCode from 'qrcode'; const generateQrCode = () => { QRCode.toDataURL(qrCodeInfo.generateCharacter).then((url)=>{ // 这个就是 二维码图 }) } const runTimerJump = () => { timeChange = setInterval(() => pollPayResult(), 3000); }; // generateQrCode () 这个执行完后发起轮询,带上 tradeNo 参数,csdn是Token,判单该订单,或者该用户是否扫码