Integration
Technical introduction
WeChat Pay users have an online wallet from which they can make payments. The payment product is very flexible, as it allows different ways to access the wallet, depending on the situation. Due to WeChat offering so many ways to pay, there are a few things that should be taken into account when you want to offer WeChat Pay on your website or in your app.
Integration Types
Depending on the device and/or application the consumer is using for the payment, there are different ways in which the user can open the payment request in their WeChat application. The three devices/ways to pay that are currently supported within Connect are:
- QR-code:The consumer is on a desktop device, where (s)he scans a QR-code, shown on the MyCheckout hosted payment pages or your own website. The QR-code is scanned from the WeChat app of the consumer and the payment appears in the application.
- URL-intent: The consumer is on a mobile browser, where (s)he will be shown a button that, after clicking or tapping it, opens the WeChat app of the consumer and shows the payment.
- In-App: The consumer is using your native application(for Android or iOS) to make a payment directly in the app. The WeChat application will NOT open in this case. Instead you are expected to invoke the Native WeChat Android or iOS SDK which you have also included in your application.
- JavaScript API: Known as Official Account. The consumer is viewing your website using a QQ browser, usually inside the WeChat application. You are expected to invoke WeChat’s JavaScript API on your website to finalize the payment.
- Mini Programs: The consumer is using your WeChat mini program inside the WeChat application. You are expected to invoke WeChat’s mini program SDK to finalize the payment.
All Integration Types are technically different and they have to be differentiated upon when calling the create Payment API. Therefore, when creating a payment with productId 863 (WeChat Pay) the following field is required: redirectPaymentMethodSpecificInput.paymentProduct863SpecificInput.integrationType. The allowed values are:
- desktopQRCode - Desktop
- urlIntent - Mobile
- nativeInApp - Native inApplication
- javaScriptAPI - Official Account
- miniProgram - Mini Program
Please note that for payments with WeChat Pay, beside the integration type, it is also required to send the fraudFields.customerIpAddress field in the create payment API.
NO extra fields are required when creating a Hosted Checkout session. The MyCheckout hosted payment pages are capable of both determining the required integration type and the customer’s IP address.
Merchant Action
Once the payment has been created you will receive a response with status REDIRECTEDNext to that, the response will contain a MerchantActionwith a MerchantActionType of SHOW_FORM. Depending on the Integration Type that was used to create the payment, different show data will be returned. In all cases the Payment ID that WeChat Pay has assigned to it internally will be returned with key: WECHAT_PAYMENTID. This ID doesn’t necessarily need to be shown to the consumer, however it is required as input for the WeChat Native SDK. Full show data that will be returned per integration type is shown in the tables below.
desktopQRCode
Key |
Value |
Note |
QRCODE |
String(64) |
The String is a Base64 encoded png image. Display the QR code to the consumer. |
WECHAT_PAYMENTID |
String(32) |
The WeChat Pay internal payment ID. |
urlIntent
Key |
Value |
Note |
URLINTENT |
String(64) |
The String is a URL-intent that will work with both Android and iOS phones. Have the intent executed on a button click from the consumer. The intent will open the payment in the consumer’s WeChat application. |
WECHAT_PAYMENTID |
String(32) |
The WeChat Pay internal payment ID. |
Full third party data returned per integration type is shown in the tables below.
nativeInApp
Key |
Value |
Note |
WECHAT_SIGNATURE |
String(32) |
Signature of the payment that was created at WeChat Pay. Required as input for the in-app payment API of the Native WeChat SDK. |
SIGNATURE_NONCE |
String(32) |
Nonce that was used to create the payment. Required as input for the in-app payment API of the Native WeChat SDK. |
WECHAT_PAYMENTID |
String(32) |
The WeChat Pay internal payment ID. Required as input for the in-app payment API of the Native WeChat SDK. |
javaScriptAPI and MiniProgram
Key |
Value |
Note |
appId |
String(32) |
The registered AppId for the merchant. Required as input for the third party call to WeChat’s Java Script SDK in the javaScriptAPI flow |
nonceStr |
String(32) |
Nonce that was used to create the payment. Required as input in the third party calls for both the javaScriptAPI and miniProgram flows |
packageSign |
String(32) |
The WeChat Pay packageSign. This consists of the prepayId and a prefix. Required as input in the third party calls for both the javaScriptAPI and miniProgram flows.Tracking the payment status |
paySign |
String(32) |
Signature of the payment that was created at WeChat Pay. Required as input in the third party calls for both the javaScriptAPI and miniProgram flows. |
prepayId | String(32) | The WeChat Pay internal payment ID. This is not required as an input for either flows. |
timeStamp | String(32) | The timestamp of the WeChat Pay payment. Required as input in the third party calls for both the javaScriptAPI and miniProgram flows. |
Tracking the payment status
When the consumer has scanned the QR code or clicked on the button to activate the URL intent, they will no longer be interacting with your website, but instead they are now interacting with the WeChat application on their phones. Both payment options do not allow for a callback from the WeChat app when the consumer has completed the payment. Instead we offer the Third-Party Payment Status API in order to keep track of the payment status when the user is interacting with the WeChat application.
This call, when used with WeChat Pay (863), will return one of two statuses: WAITING or COMPLETED that indicate to you whether the user is still completing the payment, or whether he is done. You are expected to poll for this status once every three seconds and update the page when the status has changed to COMPLETED.
Please note that the COMPLETED status does NOT indicate that the payment itself was successful. In order to find out whether the payment was successful you should retrieve it separately via the get payment API.
Also note that even though this call will also work for native in-app, javaScript API and Mini Program payments, you should not need it. The Native WeChat Pay SDK, JavaScript API and Mini Program SDK will provide your app with a callback when the payment has finished. At this point you are expected to start querying for the payment’s status via the get payment API.
Next Process flows