前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >微信H5支付

微信H5支付

作者头像
Javen
发布2018-08-21 11:28:52
7.3K1
发布2018-08-21 11:28:52
举报
文章被收录于专栏:酷玩时刻

本篇文件来聊聊微信服务商模式以及商户模式下微信H5支付

先说一个事情。8月1号开始微信公众平台支付的开发配置页面迁移至商户平台 详细说明参考这个或者看下面的截图

平台公告 微信支付商户平台.png

官方文档 普通商户版-微信H5支付 服务商版-微信H5支付

1、申请开通微信H5支付

服务商模式下H5支付

服务商模式下点击申请开通会立即开通,邀请子商户时需要填写子商户的信息。服务商模式下与商户模式下主要的区别在于商户模式下不用填写特约商户信息、只需要填写商户H5支付相关的信息 如下图

服务商H5支付

服务商H5支付产品设置 - 微信支付商户平台

注意 填写的H5支付域名必须是对应网站备案的域名且备案主体还得与商户的主体信息一致。否则申请的时候不给予通过。审核反馈的周期不是很长一般是隔天就可以给出反馈。

2、接口流程图以及常见错误

接口流程图

简单点概括 1、用户使用非微信客户端浏览器下单 2、调用微信支付接口下单得到H5支付URL的跳转链接 3、跳转到微信唤起微信支付 4、支付成功异步通过 5、处理支付结果

详细流程介绍

1、用户在商户侧完成下单,使用微信支付进行支付 2、由商户后台向微信支付发起下单请求(调用统一下单接口)注:交易类型trade_type=MWEB 3、统一下单接口返回支付相关参数给商户后台,如支付跳转url(参数名“mweb_url”),商户通过mweb_url调起微信支付中间页 4、中间页进行H5权限的校验,安全性检查(此处常见错误请见下文) 5、如支付成功,商户后台会接收到微信侧的异步通知 6、用户在微信支付收银台完成支付或取消支付,返回商户页面(默认为返回支付发起页面) 7、商户在展示页面,引导用户主动发起支付结果的查询 8,9、商户后台判断是否接到收微信侧的支付结果通知,如没有,后台调用我们的订单查询接口确认订单状态 10、展示最终的订单支付结果给用户

常见错误:

1、网络环境未能通过安全验证,请稍后再试(IP改变导致的) 2、商家参数格式有误,请联系商家解决(H5支付的referer为空导致) 3、商家存在未配置的参数,请联系商家解决(H5支付的域名问题) 4、支付请求已失效,请重新发起支付(有效期为5分钟) 5、请在微信外打开订单,进行支付(H5支付不能直接在微信客户端内调起)

3、统一下单获取支付的URL

你做过扫码支付、公众号支付以及App支付吗?如果做过那H5支付就相当简单了,与前面的提到的几种支付方式统一下单的URL是一样的只是个别请求参数不同而已(trade_type为MWEB、scene_info必填)。如果没有做过也没有关系下面就是详细的案例了。

代码语言:javascript
复制
/**
     * 微信H5 支付
     */
    public void wapPay(){
        String ip = IpKit.getRealIp(getRequest());
        if (StrKit.isBlank(ip)) {
            ip = "127.0.0.1";
        }
        
        H5ScencInfo sceneInfo = new H5ScencInfo();
        
        H5 h5_info = new H5();
        h5_info.setType("Wap");
        h5_info.setWap_url("https://pay.qq.com");
        h5_info.setWap_name("腾讯充值");
        sceneInfo.setH5_info(h5_info);
        
        Map<String, String> params = WxPayApiConfigKit.getWxPayApiConfig()
                .setAttach("IJPay H5支付测试  -By Javen")
                .setBody("IJPay H5支付测试  -By Javen")
                .setSpbillCreateIp(ip)
                .setTotalFee("520")
                .setTradeType(TradeType.MWEB)
                .setNotifyUrl(notify_url)
                .setOutTradeNo(String.valueOf(System.currentTimeMillis()))
                .setSceneInfo(h5_info.toString())
                .build();
        
        String xmlResult = WxPayApi.pushOrder(false,params);
log.info(xmlResult);
        Map<String, String> result = PaymentKit.xmlToMap(xmlResult);
        
        String return_code = result.get("return_code");
        String return_msg = result.get("return_msg");
        if (!PaymentKit.codeIsOK(return_code)) {
            ajax.addError(return_msg);
            renderJson(ajax);
            return;
        }
        String result_code = result.get("result_code");
        if (!PaymentKit.codeIsOK(result_code)) {
            ajax.addError(return_msg);
            renderJson(ajax);
            return;
        }
        // 以下字段在return_code 和result_code都为SUCCESS的时候有返回
        
        String prepay_id = result.get("prepay_id");
        String mweb_url = result.get("mweb_url");
        
        renderText("prepay_id:"+prepay_id+" mweb_url:"+mweb_url);
    }

在手机浏览器中访问mweb_url即可唤起微信进行支付

更正 20170830 1、上面复制mweb_url到手机浏览器访问会出现网络环境未能通过安全验证,请稍后再试 为什么呢? 因为发起支付与唤起支付的IP不一致 2、微信H5支付必须在设置的域名(商户平台--"产品中心"--"开发配置")网页中发起支付不然会出现商家参数格式有误,请联系商家解决 为什么呢? 因为微信H5支付需要验证支付的referer

更正后的代码如下:

代码语言:javascript
复制
/**
     * 微信H5 支付
     * 注意:必须再web页面中发起支付且域名已添加到开发配置中
     */
    public void wapPay(){
        String ip = IpKit.getRealIp(getRequest());
        if (StrKit.isBlank(ip)) {
            ip = "127.0.0.1";
        }
        
        H5ScencInfo sceneInfo = new H5ScencInfo();
        
        H5 h5_info = new H5();
        h5_info.setType("Wap");
        //此域名必须在商户平台--"产品中心"--"开发配置"中添加
        h5_info.setWap_url("https://pay.qq.com");
        h5_info.setWap_name("腾讯充值");
        sceneInfo.setH5_info(h5_info);
        
        Map<String, String> params = WxPayApiConfigKit.getWxPayApiConfig()
                .setAttach("IJPay H5支付测试  -By Javen")
                .setBody("IJPay H5支付测试  -By Javen")
                .setSpbillCreateIp(ip)
                .setTotalFee("520")
                .setTradeType(TradeType.MWEB)
                .setNotifyUrl(notify_url)
                .setOutTradeNo(String.valueOf(System.currentTimeMillis()))
                .setSceneInfo(h5_info.toString())
                .build();
        
        String xmlResult = WxPayApi.pushOrder(false,params);
log.info(xmlResult);
        Map<String, String> result = PaymentKit.xmlToMap(xmlResult);
        
        String return_code = result.get("return_code");
        String return_msg = result.get("return_msg");
        if (!PaymentKit.codeIsOK(return_code)) {
            ajax.addError(return_msg);
            renderJson(ajax);
            return;
        }
        String result_code = result.get("result_code");
        if (!PaymentKit.codeIsOK(result_code)) {
            ajax.addError(return_msg);
            renderJson(ajax);
            return;
        }
        // 以下字段在return_code 和result_code都为SUCCESS的时候有返回
        
        String prepay_id = result.get("prepay_id");
        String mweb_url = result.get("mweb_url");
        
        System.out.println("prepay_id:"+prepay_id+" mweb_url:"+mweb_url);
        redirect(mweb_url);
    }

在Web页面中发起支付

具体实现可以参考开源项目 IJPay 让支付触手可及

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2017.08.23 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1、申请开通微信H5支付
  • 2、接口流程图以及常见错误
  • 3、统一下单获取支付的URL
相关产品与服务
ICP备案
在中华人民共和国境内从事互联网信息服务的网站或APP主办者,应当依法履行备案手续。腾讯云为您提供高效便捷的 ICP 备案服务。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档