微信支付 JS API支付接口详解


Posted in Javascript onJuly 11, 2016

一、JS API支付接口(getBrandWCPayRequest)

微信JS API只能在微信内置浏览器中使用,其他浏览器调用无效。微信提供getBrandWCPayRequest接口供商户前端网页调用,调用之前微信会鉴定商户支付权限,若商户具有调起支付的权限,则将开始支付流程。这里主要介绍支付前的接口调用规则,支付状态消息通知机制请参加下文。接口需要注意:所有传入参数都是字符串类型!

getBrandWCPayRequest参数如下图所示。

参数 名称 必填 格式 说明
appId 公众号id 字符串类型 商户注册具有支付权限的公众号成功后即可获得;
timeStamp 时间戳 字符串类型,32个字节以下 商户生成,从1970年1月1日00:00:00至今的秒数,即当前的时间,且最终需要转换为字符串形式;
nonceStr 随机字符串 字符串类型,32个字节以下 商户生成的随机字符串;
package 订单详情扩展字符串 字符串类型,4096个字节以下 商户将订单信息组成该字符串,具体组成方案参见接口使用说明中package组包帮劣;由商户按照规范拼接后传入;
signType 签名方式 字符串类型,参数取值"SHA1" 按照文档中所示填入,目前仅支持SHA1;
paySign 签名 字符串类型 商户将接口列表中的参数按照指定方式?行签名,签名方式使用signType中标示的签名方式,具体签名方案参见接口使用说明中签名帮劣;由商户按照规范签名后传入;

    getBrandWCPayRequest返回值如下表所示。

返回值 说明
err_msg get_brand_wcpay_request:ok  支付成功 get_brand_wcpay_request:cancel 支付过程中用户取消 get_brand_wcpay_request:fail 支付失败

JS API的返回结果 get_brand_wcpay_request:ok 仅在用户成功完成支付时返回。由于前端交互复杂,get_brand_wcpay_request:cancel 或者 get_brand_wcpay_request:fail 可以统一处理为用户遇到错误或者主动放弃,不必细化区分。

二、JS API支付实现

下面代码是微信官方提供的JS API支付demo

<?php
include_once("WxPayHelper.php");
$commonUtil = new CommonUtil();
$wxPayHelper = new WxPayHelper();
$wxPayHelper->setParameter("bank_type", "WX");
$wxPayHelper->setParameter("body", "test");
$wxPayHelper->setParameter("partner", "1900000109");
$wxPayHelper->setParameter("out_trade_no", $commonUtil->create_noncestr());
$wxPayHelper->setParameter("total_fee", "1");
$wxPayHelper->setParameter("fee_type", "1");
$wxPayHelper->setParameter("notify_url", "htttp://www.baidu.com");
$wxPayHelper->setParameter("spbill_create_ip", "127.0.0.1");
$wxPayHelper->setParameter("input_charset", "GBK");
?>
<html>
<script language="javascript">
function callpay()
{
 WeixinJSBridge.invoke('getBrandWCPayRequest',<?php echo $wxPayHelper->create_biz_package(); ?>,function(res){
 WeixinJSBridge.log(res.err_msg);
 alert(res.err_code+res.err_desc+res.err_msg);
 });
}
</script>
<body>
<button type="button" onclick="callpay()">wx pay test</button>
</body>
</html>

将其中的微信支付参数修改成自己所申请得到的,然后将网页上传到微信支付目录下,给测试账号回复该网页地址。用户就可以实现一次JS API支付。

三、效果演示

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

微信支付 JS API支付接口详解

确认交易:

微信支付 JS API支付接口详解

输入支付密码:

微信支付 JS API支付接口详解

交易成功:

微信支付 JS API支付接口详解

       以上就是对微信支付JS API 资料的整理,希望能帮到大家,谢谢支持!

Javascript 相关文章推荐
JavaScript中的其他对象
Jan 16 Javascript
js 使用form表单select类实现级联菜单效果
Dec 19 Javascript
js Array操作的最简短最容易理解方法
Dec 09 Javascript
JavaScript中的普通函数与构造函数比较
Apr 07 Javascript
JavaScript精炼之构造函数 Constructor及Constructor属性详解
Nov 05 Javascript
jQuery事件用法详解
Oct 06 Javascript
js HTML5手机刮刮乐代码
Sep 29 Javascript
vue实现组件之间传值功能示例
Jul 13 Javascript
JS实现的杨辉三角【帕斯卡三角形】算法示例
Feb 26 Javascript
vue组件中watch props根据v-if动态判断并挂载DOM的问题
May 12 Javascript
Node.js Windows Binary二进制文件安装方法
May 16 Javascript
微信小程序实现pdf、word等格式文件上传的方法
Sep 10 Javascript
判断输入的字符串是否是日期格式的简单方法
Jul 11 #Javascript
JS判断日期格式是否合法的简单实例
Jul 11 #Javascript
深入浅析JavaScript中的scrollTop
Jul 11 #Javascript
js鼠标单击和双击事件冲突问题的快速解决方法
Jul 11 #Javascript
js 弹出对话框(遮罩)透明,可拖动的简单实例
Jul 11 #Javascript
Bootstrap3制作搜索框样式的方法
Jul 11 #Javascript
jQuery实现table中的tr上下移动并保持序号不变的实例代码
Jul 11 #Javascript
You might like
一步一步学习PHP(5) 类和对象
2010/02/16 PHP
常用的PHP数据库操作方法(MYSQL版)
2011/06/08 PHP
PHP 读取Postgresql中的数组
2013/04/14 PHP
PHP资源管理框架Assetic简介
2014/06/12 PHP
php抛出异常与捕捉特定类型的异常详解
2016/10/26 PHP
Yii2汉字转拼音类的实例代码
2017/04/18 PHP
php脚本守护进程原理与实现方法详解
2017/07/20 PHP
PHP实现正则匹配所有括号中的内容
2018/06/22 PHP
PHP设计模式入门之状态模式原理与实现方法分析
2020/04/26 PHP
js版本A*寻路算法
2006/12/22 Javascript
通过Mootools 1.2来操纵HTML DOM元素
2009/09/15 Javascript
firefox事件处理之自动查找event的函数(用于onclick=foo())
2010/08/05 Javascript
Jquery实现动态切换图片的方法
2015/05/18 Javascript
javascript 动态修改css样式方法汇总(四种方法)
2015/08/27 Javascript
全面解析JavaScript中的valueOf与toString方法(推荐)
2016/06/14 Javascript
vuejs如何配置less
2017/04/25 Javascript
import与export在node.js中的使用详解
2017/09/28 Javascript
AngularJS实现与后台服务器进行交互的示例讲解
2018/08/13 Javascript
Vue axios设置访问基础路径方法
2018/09/19 Javascript
vue+element+Java实现批量删除功能
2019/04/08 Javascript
js实现页面导航层级指示效果
2020/08/25 Javascript
[01:56]《DOTA2》中文配音CG
2013/04/22 DOTA
[05:09]2016国际邀请赛中国区预选赛淘汰赛首日精彩回顾
2016/06/29 DOTA
Python中的pprint折腾记
2015/01/21 Python
python使用PyGame模块播放声音的方法
2015/05/20 Python
小议Python中自定义函数的可变参数的使用及注意点
2016/06/21 Python
Django项目实战之用户头像上传与访问的示例
2018/04/21 Python
Django contenttypes 框架详解(小结)
2018/08/13 Python
python列表每个元素同增同减和列表元素去空格的实例
2019/07/20 Python
Window10上Tensorflow的安装(CPU和GPU版本)
2020/12/15 Python
Html5 语法与规则简要概述
2014/07/29 HTML / CSS
Abbott Lyon官网:女士手表、珠宝及配件
2020/12/26 全球购物
个性婚礼策划方案
2014/05/17 职场文书
2014年幼儿园班级工作总结
2014/12/17 职场文书
土建技术员岗位职责
2015/04/11 职场文书
Html分层的box-shadow效果的示例代码
2021/03/30 HTML / CSS