微信公众号支付(三):页面调用微信支付JS并完成支付
2015-09-15 14:38
701 查看
一、调用微信的JS文件
1.首先要绑定【JS接口安全域名】,“公众号设置”的“功能设置”中
2.引入JS文件
备注:支持使用 AMD/CMD 标准模块加载方法加载
3.通过config接口注入权限验证配置
4.通过ready接口处理成功验证
二、wx.config中的签名
1.首先要获取到access token:公众号的全局唯一票据 。然后根据access token获取到jsapi_ticket:公众号用于调用微信JS接口的临时票据。再用jsapi_ticket获取到签名。
2.获取access token:文档:url:http://mp.weixin.qq.com/wiki/15/54ce45d8d30b6bf6758f68d2e95bc627.html
有些方法在前两篇中。
3.获取jsapi_ticket
注意:jsapi_ticket和access token为7200的有效时间。7200后要重新获取,我是放在线程里面死循环的。
4.算签名
注意:有些方法在前两篇中
这样就算出签名了。
5.传递到前端页面
把随机字符串:nonce_str,timestamp时间戳,appId,签名,包装为prepay_id=prepay_id的预支付ID传递到前端。
6.现在就可以使用微信JS了。
三、调用微信支付
在前一篇中已经获取到了预支付订单的ID,prepay_id,
注意:有些方法在前2篇中。
微信支付的最后一步:js调用
结束,微信支付全部结束啦,有问题可以留言找我哦,只会java的,88
1.首先要绑定【JS接口安全域名】,“公众号设置”的“功能设置”中
2.引入JS文件
备注:支持使用 AMD/CMD 标准模块加载方法加载
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
3.通过config接口注入权限验证配置
wx.config({ debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。 appId: '', // 必填,公众号的唯一标识 timestamp: , // 必填,生成签名的时间戳 nonceStr: '', // 必填,生成签名的随机串 signature: '',// 必填,签名,见附录1 jsApiList: ['chooseWXPay'] // 必填,需要使用的JS接口列表,这里只写支付的 });
4.通过ready接口处理成功验证
wx.ready(function(){ wx.hideOptionMenu();//隐藏右边的一些菜单 });
二、wx.config中的签名
1.首先要获取到access token:公众号的全局唯一票据 。然后根据access token获取到jsapi_ticket:公众号用于调用微信JS接口的临时票据。再用jsapi_ticket获取到签名。
2.获取access token:文档:url:http://mp.weixin.qq.com/wiki/15/54ce45d8d30b6bf6758f68d2e95bc627.html
public static Token getToken(String appid, String appsecret) { Token token = null; String requestUrl = Constants.token_url.replace("APPID", appid).replace("APPSECRET", appsecret); // 发起GET请求获取凭证 JSONObject jsonObject = CommonUtil.httpsRequestToJsonObject(requestUrl, "GET", null); if (null != jsonObject) { try { token = new Token(); token.setAccessToken(jsonObject.getString("access_token")); token.setExpiresIn(jsonObject.getInt("expires_in")); } catch (JSONException e) { token = null; // 获取token失败 log.error("获取token失败 "+jsonObject.getInt("errcode")+","+jsonObject.getString("errmsg")); } } return token; }
有些方法在前两篇中。
3.获取jsapi_ticket
public static Ticket getTicket() { //Constants.ticket_url = https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi String requestUrl = Constants.ticket_url.replace("ACCESS_TOKEN", TokenThread.accessToken.getAccessToken()); // 发起GET请求获取凭证 JSONObject jsonObject = CommonUtil.httpsRequestToJsonObject(requestUrl, "GET", null); Ticket ticket = null; String jsapi_ticket = ""; int expires_in = 0; if (null != jsonObject) { try { jsapi_ticket = jsonObject.getString("ticket"); expires_in = jsonObject.getInt("expires_in"); ticket = new Ticket(); ticket.setTicket(jsapi_ticket); ticket.setExpiresIn(expires_in); } catch (JSONException e) { // 获取失败 log.error("获取jsapi_ticket失败"+jsonObject.getInt("errcode")+","+jsonObject.getString("errmsg")); } } return ticket; }
注意:jsapi_ticket和access token为7200的有效时间。7200后要重新获取,我是放在线程里面死循环的。
4.算签名
/** * 签名实体类 * @author rory.wu * */ public class Signature implements Serializable { private static final long serialVersionUID = -7799030247222127708L; private String url; private String jsapi_ticket; private String nonceStr; private String timestamp; private String signature; //下面是getset方法 }
/** * 算出签名 * @param jsapi_ticket * @param url 业务中调用微信js的地址 * @return */ public static Signature sign(String jsapi_ticket, String url) { String nonce_str = CommonUtil.create_nonce_str(); String timestamp = CommonUtil.create_timestamp(); String string1; String signature = ""; //注意这里参数名必须全部小写,且必须有序 string1 = "jsapi_ticket=" + jsapi_ticket + "&noncestr=" + nonce_str + "×tamp=" + timestamp + "&url=" + url; try { MessageDigest crypt = MessageDigest.getInstance("SHA-1"); crypt.reset(); crypt.update(string1.getBytes("UTF-8")); signature = CommonUtil.byteToStr(crypt.digest()); } catch (NoSuchAlgorithmException e) { e.printStackTrace(); } catch (UnsupportedEncodingException e) { e.printStackTrace(); } Signature result = new Signature(); result.setUrl(url); result.setJsapi_ticket(jsapi_ticket); result.setNonceStr(nonce_str); result.setTimestamp(timestamp); result.setSignature(signature); return result; }
注意:有些方法在前两篇中
这样就算出签名了。
5.传递到前端页面
把随机字符串:nonce_str,timestamp时间戳,appId,签名,包装为prepay_id=prepay_id的预支付ID传递到前端。
wx.config({ appId: '${appId}', // 必填,公众号的唯一标识 timestamp: ${timestamp}, // 必填,生成签名的时间戳 nonceStr: '${nonceStr}', // 必填,生成签名的随机串 signature: '${signature}',// 必填,签名,见附录1 jsApiList: ['chooseWXPay'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2 });
6.现在就可以使用微信JS了。
三、调用微信支付
在前一篇中已经获取到了预支付订单的ID,prepay_id,
/** * 微信支付对象 * @author rory.wu * */ public class WxPay implements Serializable { private static final long serialVersionUID = 3843862351717555525L; private String paySign; private String prepay_id; private String nonce_str; private String timeStamp; //get,set方法 }
/** * 获取页面上weixin支付JS所需的参数 * @param map * @return */ private WxPay getWxPayInfo(String prepay_id) { String nonce = CommonUtil.create_nonce_str().replace("-", ""); String timeStamp = CommonUtil.create_timestamp(); //再算签名 String newPrepay_id = "prepay_id="+prepay_id; String args = "appId="+Constants.appid +"&nonceStr="+nonce +"&package="+newPrepay_id +"&signType=MD5" +"&timeStamp="+timeStamp +"&key="+key; String paySign = SignUtil.getSign(args, "MD5"); WxPay wxPay = new WxPay(); wxPay.setNonce_str(nonce); wxPay.setPaySign(paySign); wxPay.setPrepay_id(newPrepay_id); wxPay.setTimeStamp(timeStamp); return wxPay; }
注意:有些方法在前2篇中。
微信支付的最后一步:js调用
wx.chooseWXPay({ timestamp: json.timeStamp, nonceStr: json.nonce_str, package: json.prepay_id, signType: 'MD5', paySign: json.paySign, success: function (res) { alert("支付成功"); } });
结束,微信支付全部结束啦,有问题可以留言找我哦,只会java的,88
相关文章推荐
- 链接分享到微信之网页被重排及图标不显示的问题
- android 应用实现微信好友或朋友圈分享
- 【JavaScript】微信适配的Head
- 小程序-----统计字符串中数字,中文,空格,字母的个数
- 微信内置浏览器 长按识别二维码 功能的两三个坑与解决方案
- 微信公众平台昵称乱码emoji表情过滤
- 用chrome模拟微信浏览器访问需要OAuth2.0网页授权的页面
- 微信接口封装
- 微信JAVA接入公共类
- 微信开发大坑之数据无法正常存储至数据库
- 微信企业号开发:微信考勤百度地图定位二
- 第一篇 微信商城 开发前的准备工作
- ios 微信浏览器中 触发webkitTransitionEnd 问题
- 微信支付商户平台,企业付款,企业向个人付款接口总结
- php开发微信公众号 第三方平台一键绑定(授权)感言
- 二分法小程序的问题
- 二分法小程序的问题
- C#_微信支付V3
- 3.仿微信--注册界面 补充用到的类
- 3.仿微信--注册界面 布局实现