Search code examples
javascripthtmlwechat

Detect if WeChat QR code is scanned

I am trying to build an app that renders a Wechat QR code and it will be scanned by a WeChat mobile app to proceed the payment.. Authentication, securities and validations are implemented on the app of course so not everybody can do the scan. But I want really want to achieve is like once the QR code is scanned, the tab with the QR code will automatically be closed or at least trigger something in the javascript. Is it possible?

Take Note:

The QR Code is a rendered image that came from an API return

Solution

  • This is a classic problem in 3rd payment integration. I guess it is WeChat Payment in your case.

    The logic is:

    1. Invoke API to start an order and get QR code image. Please note in the API, you can register a callback URL (notify_url), which belong to your server.
    2. User scan the QR code image to pay.
    3. WeChat server receives the scan operation, try to do the payment work, and invoke your notify_url.
    4. In your server, the payment success/fail information is received and this information is pushed to client.
    5. Client receive the payment success/fail information and do the UI work.

    For how to push information from server to client, there are various ways:

    • WebSocket
    • Server Sent Event
    • Comet
    • Repeated ajax request using setInterval