Home >WeChat Applet >WeChat Development >WeChat Pay develops H5 payment
This article introduces the H5 payment implementation process under WeChat payment.
H5 payment is a non-WeChat browser payment method developed based on public accounts (you need to apply for payment permission separately), which can satisfy the mobile H5 page outside WeChat. Requirements for WeChat payment. .
Test address
http://wxpay.weixin.qq.com/pub_v2/pay/wap.v2.php
http://wxpay.weixin.qq .com/mch/pay/h5.v2.php
Rendering
Flowchart
The main thing is to first define the name and price of the product, as well as the transaction number. code show as below.
include_once("../WxPayPubHelper/WxPayPubHelper.php"); //使用统一支付接口 $unifiedOrder = new UnifiedOrder_pub(); //设置统一支付接口参数 //设置必填参数 //appid已填,商户无需重复填写 //mch_id已填,商户无需重复填写 //noncestr已填,商户无需重复填写 //spbill_create_ip已填,商户无需重复填写 //sign已填,商户无需重复填写 $unifiedOrder->setParameter("body","H5支付测试");//商品描述 $timeStamp = time(); $out_trade_no = WxPayConf_pub::APPID."$timeStamp"; $unifiedOrder->setParameter("out_trade_no","$out_trade_no");//商户订单号 $unifiedOrder->setParameter("total_fee","1");//总金额 //$unifiedOrder->setParameter("notify_url",WxPayConf_pub::NOTIFY_URL);//通知地址 $unifiedOrder->setParameter("trade_type","WAP");//交易类型 //非必填参数,商户可根据实际情况选填 $unifiedOrder->setParameter("device_info","100001");//设备号
The above parameters are finally encapsulated into the following similar XML parameters
<xml> <out_trade_no></out_trade_no> <total_fee>1</total_fee> //<notify_url></notify_url> <trade_type></trade_type> <device_info>100001</device_info> <appid></appid> <mch_id>1237905502</mch_id> <spbill_create_ip></spbill_create_ip> <nonce_str></nonce_str> <sign></sign></xml>
Send the above XML to the unified payment interface
https://api.mch.weixin.qq.com/pay/unifiedorder
Get the following XML data
<xml> <return_code></return_code> <return_msg></return_msg> <appid></appid> <mch_id></mch_id> <device_info></device_info> <nonce_str></nonce_str> <sign></sign> <result_code></result_code> <prepay_id></prepay_id> <trade_type></trade_type> </xml>
In this way, you will get a prepayid
The merchant server calls the unified ordering interface to request an order. For the api, please refer to the public api [ Unified order] (the trade_type in the interface needs to be defined as WAP), WeChat will return the prepayid to the merchant, the merchant generates a deeplink in a fixed format, and the user clicks the deeplink to activate WeChat payment.
deeplink format:
weixin://wap/pay?appid%3Dwxf5b5e87a6a0fde94%26noncestr%3D123%26package%3D123%26prepayid%3Dwx20141203201153d7bac0d2e10889028866%26sign%3D6AF4B69CCC30926F85770F900D098D64%26timestamp%3D1417511263
The steps to generate deeplink are as follows:
Step 1: Assemble parameters according to URL format, and perform URL encoding on the $value part. Generate string1:
string1: key1=Urlencode($value1)&key2=Urlencode($value2,&...
Step 2: Urlencode the entire string1 and generate string2:
String2=Urlencode(string1 );
Step 3: Splice the prefix to generate the final deeplink
For example:
String1:
appid=wxf5b5e87a6a0fde94&noncestr=123&package=WAP&prepayid=wx201412101630480281750c890475924233&sign=53D411FB74FE0B0C79CC94F2AB0E2333×tamp=1417511263
Do it again for the entire string1 URLEncode
string2:
appid%3Dwxf5b5e87a6a0fde94%26noncestr%3D123%26package%3DWAP%26prepayid%3Dwx201412101630480281750c890475924233%26sign%3D53D411FB74FE0B0C79CC94F2AB0E2333%26timestamp%3D1417511263
Add the protocol header weixin://wap/pay? to get the final deeplink
weixin://wap/pay?appid%3Dwxf5b5e87a6a0fde94%26noncestr%3D123%26package%3DWAP%26prepayid%3Dwx201412101630480281750c890475924233%26sign%3D53D411FB74FE0B0C79CC94F2AB0E2333%26timestamp%3D1417511263
Field name | Variable name | Required | Type | Example value | Description |
---|---|---|---|---|---|
Public account ID | appid | is | String(32) | wx88888888888888888 | Public account ID assigned by WeChat |
Random string | noncestr | is | String(32) | 5K8264ILTKCH16CQ2502SI8ZNMTM67VS | Random string, no longer than 32 bits. Recommended random number generation algorithm |
package | is | String(32) | WAP | extension field, fixed to fill in WAP | |
prepayid | is | String(64) | wx201410272009395522657a690389285100 | The prepayment reply ID returned by the WeChat unified ordering interface is used in subsequent interface calls. This value is valid for 2 hours. | |
sign | is the | String(32) | C380BEC2BFD727A4B6845133519F3AD6 | signature, see signature generation algorithm for details | |
timestamp | is the current time of | String(32) | 1414561699 | . For other details, please see the timestamp. rule |