微信支付JS API支付界面详解

一、JS API支付接口(getBrandWCPayRequest)

微信JS API只能在微信内置浏览器中使用，其他浏览器调用无效。微信提供getBrandWCPayRequest接口，用于调用商家的前端网页。来电前，微信会识别商家的支付权限。如果商家有权调整支付，支付过程将开始。本文主要介绍支付前的接口调用规则。请参考下面的支付状态消息通知机制。要注意接口：传入的参数都是字符串类型的！

getBrandWCPayRequest参数如下图所示。

参数名称必填格式说明appId微信官方账号Id为字符串类型，可在商家成功注册具有支付权限的微信官方账号后获取；TimeStamp是一种字符串类型，由小于32字节的商家生成。1970年1月1日开始的秒数，00:00:00，是当前时间，最后需要转换成字符串形式；NonceStr随机字符串为字符串类型，是商家生成的小于32字节的随机字符串；包订单详细信息扩展字符串是一个字符串类型，小于4096字节的商家将订单信息组成这个字符串。具体组成方案请参考界面说明中的包包。商家按规格拼接后推出；SignType签名方法是字符串类型；参数值“SHA1”如文档所示进行填充；目前只支持sha1。PaySign签名是指字符串型商家以指定的方式对界面列表中的参数进行签名，签名方式使用signType中标记的签名方式。具体的签名方案，参见接口说明中的签名帮助；由商家按规格签字后再进口；GetBrandWCPayRequest返回值如下表所示。

返回值表示err _ msg get _ brand _ wcpay _ request 3360 ok支付成功。在get _ brand _ wcpay _ request 3360 cancel的支付过程中，用户取消了get _ brand _ wcpay _ request 3360 fail fail fail的支付。JS API的返回结果get _ brand _ wcpay _ request3360ok只有在用户成功完成支付时才会返回。由于前端交互复杂，get _ brand _ wcpay _ request : cancel或get _ brand _ wcpay _ request : failure可以统一处理为用户遇到错误或主动放弃，无需细化区分。

二、JS API支付实现

以下代码是微信官方提供的JS API支付演示

？phpinclude _ once(' wxpayhelper . PHP ')；$ common util=new common util()；$ wxPayHelper=new wxPayHelper()；$ wxPayHelper-set parameter(' bank _ type '，' WX ')；$ wxPayHelper-set parameter(' body '，' test ')；$ wxPayHelper-set parameter(' partner '，' 1900000109 ')；$ wxPayHelper-set parameter(' out _ trade _ no '，$ commonUtil-create _ non crest())；$ wxPayHelper-set parameter(' total _ fee '，' 1 ')；$ wxPayHelper-set parameter(' fee _ type '，' 1 ')；$ WxpayHelper-SetParameter(' notify _ URL '，' http://www . Baidu.com ')；$ wxPayHelper-set parameter(' sp bill _ create _ IP '，' 127 . 0 . 0 . 1 ')；$ wxPayHelper-set parameter(' input _ charset '，' GBK ')；html script language=' JavaScript ' function call pay(){ weixinsbridge . invoke(' getBrandWCPayRequest '，PHP echo $ wxPayHelper-create _ biz _ package()；function(RES){ weixinsbridge . log(RES . err _ msg)；alert(RES . err _ code RES . err _ desc RES . err _ msg)；});}/script body button type=' button ' onclick=' callpay()' wxpaytest/button/body/html将微信支付参数修改为您申请的参数，然后将网页上传到微信支付目录，并将网页地址回复给测试账号。用户可以一次实现JS API支付。

三、效果示范

以下是官方DEMO修改后发起支付的页面图。

确认交易：

输入支付密码：

交易成功：

以上是针对微信支付的JS API数据整理，希望对大家有所帮助，感谢大家的支持！