微信公众号支付(三):页面调用微信支付JS并完成支付
一、调用微信的JS文件
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
微信公众号支付(三):页面调用微信支付JS并完成支付的更多相关文章
- 微信公众号对接JS-SDK接口 调用微信内置地图
微信js-sdk开发文档:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html 1.页面配置 引用微信js- ...
- Java开发微信公众号(三)---微信服务器请求消息,响应消息,事件消息以及工具处理类的封装
在前面几篇文章我们讲了微信公众号环境的配置 和微信公众号服务的接入,接下来我们来说一下微信服务器请求消息,响应消息以及事件消息的相关内容,首先我们来分析一下消息类型和返回xml格式及实体类的封装. ( ...
- appium操作微信公众号H5 web页面
安卓微信公众号的H5页面是webview,一般操作需要切换context. 在执行如下步骤,就能直接像识别native样识别webview 1.代码追加: ChromeOptions options ...
- Java开发微信公众号(一)---初识微信公众号以及环境搭建
ps:1.开发语言使用Java springMvc+Mybaits+spring maven实现 2.使用微信接口测试账号进行本地测试 https://mp.weixin.qq.com/debug/c ...
- NodeJs 开发微信公众号(三)微信事件交互
微信公众号有个规则,一旦开启了开发者模式,其他的常规功能就都必须通过接口调用完成.比如说自定义菜单功能,必须通过发送post请求的方式生成.本章就通过关注到取消关注的整个过程来谈一谈nodejs是怎么 ...
- 三星note4,微信公众号开发,页面闪退
在做微信公众号开发时,使用三星note4测试,有一个select框闪退的问题出现. 出现该问题的原因是该选择框,设置了appearance:none;属性.查找了官方解释是: 所有主流浏览器都不支持 ...
- .NET微信公众号开发-1.0初始微信公众号
一.前言 微信公众号是开发者或商家在微信公众平台上申请的应用账号,该帐号与QQ账号互通,通过公众号,商家可在微信平台上实现和特定群体的文字.图片.语音.视频的全方位沟通.互动 .形成了一 种主流的线上 ...
- 3.微信公众号开发:配置与微信公众平台服务器交互的URL接口地址
微信开发基本原理: 1.首先有3个对象 分别是微信用户端 微信公众平台服务器 开发者服务器(也就是放自己代码的服务器) 三者间互相交互 2.微信公众平台服务器 充当中间者角色 (以被动回复消息为例) ...
- 微信公众号开发--.Net Core实现微信消息加解密
1:准备工作 进入微信公众号后台设置微信服务器配置参数(注意:Token和EncodingAESKey必须和微信服务器验证参数保持一致,不然验证不会通过). 2:基本配置 设置为安全模式 3.代码实现 ...
- 玩玩微信公众号Java版之六:微信网页授权
我们经常会访问一些网站,用微信登录的时候需要用到授权,那么微信网页授权是怎么一回事呢,一起来看看吧! 参考官方文档:https://mp.weixin.qq.com/wiki?t=resource ...
随机推荐
- [Irving]SqlServer 拆分函数用法
drop function dbo.split 删除自定义函数 dbo.split 函数名 函数 dbo.splitcreate function dbo.split(@c varchar(100 ...
- 关于NSLocalizedString(@"Foo %@",nil)
NSLocalizedString(@"Foo %@",nil) 这句话实际上是在多语言文件中寻找一个key为“Foo %@”的文字,千万不要把这个和[NSString strin ...
- leecode 树的平衡判定 java
以前写过c++版本的,感觉java写的好舒心啊/** * Definition for binary tree * public class TreeNode { * int val; * TreeN ...
- ERROR hdfs.DFSClient: Failed to close file解决方法
14/04/11 17:59:44 ERROR hdfs.DFSClient: Failed to close file /wlan_out/_temporary/_attempt_local_000 ...
- Configuring Active Directory Federation Services 2.0 (配置 adfs 2.0) -摘自网络
Active Directory Federation Services (AD FS) 2.0 makes it possible to deploy a federation server and ...
- 最简单的基于FFMPEG的音频编码器(PCM编码为AAC)
http://blog.csdn.net/leixiaohua1020/article/details/25430449 本文介绍一个最简单的基于FFMPEG的音频编码器.该编码器实现了PCM音频采样 ...
- passwnger
环境:ubuntu10.04 + nginx + passenger + ruby1.8.7 rails2.3.x #安装nginx(手动编译) $ mkdir -p /home/mouse/opt ...
- Robotium学习笔记二
一. 控制测试用例的执行顺序 采用TestSuit方式来控制每条Case的运行顺序 Demo如下 public static Test suite() { TestSuite suite = new ...
- .Net设计模式_开篇
前言 其实以前看过两次设计模式,现在想来,几乎已经对设计模式没有任何印象,说明根本没有理解.或者说几乎不用,所以我除了单列.工厂外的设计模式几乎全部忘记了.最近需要写一个引擎,想用UML设计整体的架构 ...
- elasticsearch安装过程中的license问题解决办法
1.git clone git://github.com/mobz/elasticsearch-head.git 2.cd elasticsearch-head 3.npm install 出现下来问 ...