Mastering Alipay, WeChat Pay, and UnionPay Integration for Web and Mobile Apps
This guide walks developers through the complete setup, required credentials, request/response flows, and post‑payment handling for Alipay, WeChat Pay, and UnionPay on both WAP sites and native mobile applications, ensuring secure and reliable transactions.
WAP Site Payment Integration
1. Alipay Integration
Preparation: Obtain a verified corporate Alipay account and enable WAP payment.
Key parameters: Partner ID (PID), KEY (or RSA private key), product name (subject), total amount (total_fee), quantity, return_url, and notify_url.
Process flow:
User clicks the purchase button and sends a request to the website.
The website creates a unique order number.
The website signs order details with its private key and sends them to Alipay.
Alipay creates a transaction and returns a token.
The website builds a redirect URL using the token and its own signature.
The browser is redirected to Alipay’s payment page.
Alipay displays the transaction amount, quantity, and seller information.
User pays with their Alipay account.
Alipay posts a payment result (success or failure) to the website’s notify_url.
The website processes the result (e.g., shipping, order status).
The website returns the string "success" to Alipay to stop further notifications.
Alipay shows a payment‑success page, which may auto‑redirect to the merchant’s final page.
Summary: The flow consists of three stages – obtaining a token from Alipay, user payment on Alipay’s page, and handling synchronous and asynchronous notifications.
2. WeChat Pay Integration
Preparation: Apply for the appropriate WeChat Pay mode (e.g., H5, public‑account, or APP) on the WeChat platform and obtain the merchant credentials.
Process flow:
User places an order on the merchant site.
The merchant backend calls the WeChat unified order API (trade_type=MWEB) to obtain a payment URL (mweb_url).
The merchant redirects the user to the WeChat payment page via the mweb_url.
The intermediate page performs H5 permission and security checks.
After payment, WeChat sends an asynchronous notification to the merchant.
User is redirected back to the merchant page (or can manually click a return link).
The merchant may query the order status if the asynchronous notification is missing.
The final payment result is displayed to the user.
3. UnionPay Integration
Preparation: Sign a contract with UnionPay, pay the fees, and obtain the merchant ID and secret key; download the UnionPay demo and SDK.
Process flow:
Merchant backend sends order data to UnionPay according to the "Mobile Component Payment Product Interface Specification".
UnionPay validates the request and returns a transaction number (TN).
The TN is sent back to the client.
The client invokes the UnionPay payment component with the TN.
After the user completes payment, UnionPay notifies both the merchant backend and the payment component.
The component displays the result and returns it to the client.
Mobile App Payment Integration
1. Alipay Integration (App)
Preparation: Obtain a verified corporate Alipay account, download the SDK, and submit the app APK for review.
Process flow:
The app calls the Alipay payment interface with order details.
User completes payment in the Alipay client (or cancels/fails).
Alipay client returns the result to the app and notifies the merchant server.
The app processes the result locally; the server processes it on its side as well.
2. WeChat Pay Integration (App)
Preparation: Register a developer account on the WeChat Open Platform, create a mobile application, and enable WeChat Pay to obtain APPID, MCHID, and merchant key.
Process flow:
Client requests an order.
Merchant authenticates and obtains an access_token.
Parameters for the pre‑order are assembled and signed.
The unified order API is called, returning a pre‑order ID.
The pre‑order parameters are signed again.
The WeChat payment UI is launched and parameters are validated.
User enters the payment password.
Payment result and order details are returned asynchronously.
Client redirects to a result page.
3. UnionPay Integration (App)
Preparation: Sign a contract with UnionPay, obtain merchant ID and secret, download the UnionPay demo and SDK for mobile.
Process flow:
User clicks purchase in the app; the app sends an order request to the merchant backend.
The backend packages the order according to UnionPay’s specification and sends it to UnionPay.
UnionPay validates the request and returns a transaction number (TN).
The TN is sent back to the client.
The client invokes the UnionPay payment component with the TN.
After payment, UnionPay notifies both the merchant backend and the payment component.
The component displays the result and returns it to the client.
Source: https://www.cnblogs.com/lihuidu/p/6692831.html
Signed-in readers can open the original source through BestHub's protected redirect.
This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactand we will review it promptly.
ITFLY8 Architecture Home
ITFLY8 Architecture Home - focused on architecture knowledge sharing and exchange, covering project management and product design. Includes large-scale distributed website architecture (high performance, high availability, caching, message queues...), design patterns, architecture patterns, big data, project management (SCRUM, PMP, Prince2), product design, and more.
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.