非微信浏览器的h5支付demo

手机系统自带的浏览器，调用微信支付如何实现（非扫码）

翻看了微信支付的api没发现支持h5调支付接口的情况（微信js除外），

最近开发的微信公众号需要开启公众号支付功能，经过几天时间的开发，终于搞定了，在这里记录一下开发流程，也给需要的朋友提供一点点帮助。
 

功能需求：用户浏览器的移动网页进行支付，那就是调用微信H5支付，如果是使用APP客户端进行支付，那就要调用微信APP支付。

H5支付是指商户在微信客户端外的移动端网页展示商品或服务，用户在前述页面确认使用微信支付时，商户发起本服务呼起微信客户端进行支付。主要用于触屏版的手机浏览器请求微信支付的场景。可以方便的从外部浏览器唤起微信支付。顺便提醒一下，H5支付不建议在APP端使用，如需要在APP中使用微信支付，请接微信APP支付。
 

实现步骤：

1、下载官网站的SDK开发包，

https://pay.weixin.qq.com/wiki/doc/api/download/WxpayAPI_php_v3.zip

开发包结构目录：

 

2、打开demo/jsapi.php页面修改已下代码

 

//①、获取用户openid

$tools = new JsApiPay();

$openId = $tools->GetOpenid();
 

//②、统一下单

$input = new WxPayUnifiedOrder();

$input->SetBody("test");

$input->SetAttach("test");

$input->SetOut_trade_no(WxPayConfig::MCHID.date("YmdHis"));

$input->SetTotal_fee("1");

$input->SetTime_start(date("YmdHis"));

$input->SetTime_expire(date("YmdHis", time() + 600));

$input->SetGoods_tag("test");

$input->SetNotify_url("http://paysdk.weixin.qq.com/example/notify.php");

$input->SetTrade_type("JSAPI");

$input->SetTrade_type("MWEB"); //H5支付的交易类型为MWEB

$input->SetOpenid($openId); //这里要注释掉

$order = WxPayApi::unifiedOrder($input);

echo '<font color="#f00"><b>统一下单支付单信息</b></font><br/>';

 

//②、得到微信返回，支付超链接，然后显示链接，点击链接就可以调用微信APP窗口

$href="<a href='".$order["mweb_url"]."'><button class='bt' type='button' >确定支付</button></a>";

 

//注释掉下面这些信息，下面这两行是在微信浏览器中调用时会使用到

$jsApiParameters = $tools->GetJsApiParameters($order);

//获取共享收货地址js函数参数

$editAddress = $tools->GetEditAddressParameters();

 

说明，上面红色代码是需要注释掉，蓝色为加粗类型样式是是增加代码，个人理解原理是，在商户网页中对微信发起一个支付流程，然后微信服务端返回一个链接地址给商户，这时商户再次对这个链接地址点击就可以调用本地的微信APP了，

DEMO下载地址：DEMO包
 

官网帮助文档：

https://pay.weixin.qq.com/wiki/doc/api/H5.php?chapter=15_1

 

微信H5支付申请入口

登录商户平台-->产品中心-->我的产品-->支付产品-->H5支付

微信H5支付业务流程

商户侧

要求商户已有H5商城网站，并且已经过ICP备案。通过微信H5支付可以实现在非微信浏览器（如QQ浏览器、谷歌浏览器、Safari等）中使用微信支付的场景。

用户侧

步骤(1)：用户从非微信浏览器的站点导航进入商户H5网页，用户挑选需购买商品，选择微信支付发起购买流程。

步骤(2)：进入微信客户端确认交易，输入支付密码。

步骤(3)：支付成功，用户收到支付凭证，同时商户后台收到支付成功的通知。

微信H5支付开发步骤

1、用户在商户侧完成下单，使用微信支付进行支付；

2、由商户后台向微信支付发起下单请求，调用统一下单接口，交易类型trade_type=MWEB；

3、统一下单接口返回支付相关参数给商户后台，如支付跳转url（参数名“mweb_url”），商户通过mweb_url调起微信支付中间页；

4、中间页进行H5权限的校验，安全性检查；

5、如支付成功，商户后台会接收到微信侧的异步通知；

6、用户在微信支付收银台完成支付或取消支付,返回商户页面（默认为返回支付发起页面）；

7、商户在展示页面，引导用户主动发起支付结果的查询；

8、商户后台判断是否接到收微信侧的支付结果通知，如没有，后台调用我们的订单查询接口确认订单状态；

10、展示最终的订单支付结果给用户。
此文档为零起飞网络原创，如需转载请注明来源地址：http://www.07fly.com/Weixin/tech/6749.html