Pay with QR Code (Desktop Website Browser) - Alipay CN
Accept Alipay payments on your website by presenting a QR code to the shopper. A payment URL is also provided to you as a fallback in case the QR code cannot be displayed.
Step 1. Initialize a Payment Intent
Create a Payment Intent with the Create a Payment Intent API API.
POST /api/v1/pa/payment_intents/create
Step 2. Generate and render the QR code
2.1. Obtain the string representation of the QR code and the fallback URL
When a shopper selects to pay with Alipay on their desktop browser, call the Confirm a Payment Intent API API to get:
- a string representation of the QR code, and
- a fallback URL pointing to an Alipay page.
POST /api/v1/pa/payment_intents/{id}/confirm
You will get a response similar to the following.
2.2. Present the QR code to the shopper or redirect the shopper to the Alipay page
You can render the QR code image with the next_action.qrcode
returned in the confirm Payment Intent response and present it to the shopper. Shoppers will complete payment after scanning the QR code with their Alipay mobile app.
There are publicly available libraries for different programming languages to render a QR code image from its string representation. For example, if you use JavaScript, you may use qrcode to facilitate the conversion. Firstly, get a Base64-encoded image string with the qrcode library:
Then place the image string into the src
field of the img
element.
In case the QR code cannot be displayed, you should redirect the shopper to the Alipay page with the next_action.url
returned in the confirm Payment Intent response. Shoppers will be able to continue the payment by scanning the QR code rendered by Alipay on that page.
Once generated, the QR code and the URL will expire in 10 minutes. Confirming the Payment Intent again (with Alipay or any other payment methods) will void both the QR code and the URL.
Step 3. Query the payment result status
To get the payment result, we suggest you poll the status of the Payment Intent via the Retrieve a Payment Intent API API.
GET /api/v1/pa/payment_intents/{id}
- If you directly rendered and presented the QR code to the shopper, you should start polling the status immediately.
- If you redirected the shopper to the Alipay page, you may start polling the Payment Intent status after the shopper is redirected back to your website, i.e., the
return_url
passed when creating the Payment Intent.
In addition, Airwallex will notify you of the payment result asynchronously via the webhooks. Please refer to the webhook documentation to set up your webhook accordingly. Although subscribing to webhook events is optional, it is recommended to subscribe to the payment_intent.succeeded
webhook which indicates that the shopper has paid the order.