最近做完了一个项目,正好没事做,产品经理就给我安排了一个任务。
 
做一个像收钱吧这样可以统一扫码收钱的功能。
 
一开始并不知道是怎么实现的,咨询了好几个朋友,才知道大概的业务流程:先是开一个网页用来判断支付平台,是微信还是支付宝,判断过后就好办了,直接照搬微信支付和支付宝的官方文档。不过微信的文档感觉有点坑,得多花点心思。
 
现在讲讲怎么实现微信支付网页支付,也就是公众号支付:
 
1.判断支付平台,在判断是微信平台时,必须使用window.location打开网页,使用其他方法在IOS版微信无法打开网页,至少现在的新版微信无法打开。对应的连接是请求获取code的链接。第2步会讲到。
<html>
<head>
<title>判断客户平台</title>
<basefont face="微软雅黑" size="2" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta name="exporter-version" content="Evernote Windows/303244 (zh-CN, DDL); Windows/6.1.7601 Service Pack 1 (Win64);"/>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<style>
body, td {
font-family: 微软雅黑;
font-size: 10pt;
}
</style>
</head>
<body>
<script type="text/javascript"> window.onload = function(){
if(isWeiXin()){
window.location='http://www.xxoo.com/InterfaceAPI/code';
} else if(isZFB()){
alert('支付宝即将开放....');
//var p = document.getElementsByTagName('p');
//p[0].innerHTML = window.navigator.userAgent;
}else{
alert('请使用微信或者支付宝App扫码');
}
}
function isWeiXin(){
var ua = window.navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i) == 'micromessenger'){
return true;
}else{
return false;
}
}
function isZFB(){
var ua = window.navigator.userAgent.toLowerCase();
if(ua.match(/AlipayClient/i) =='alipayclient'){
return true;
}else{
return false;
}
}
</script>
</body></html>

2.这里是获取code,回调地址必须使用URLEncoder的utf-8编码,这里最终只获取openid,需要获取UserInfo其他信息的自行测试,只需要修改一下 scope 的参数,

@RequestMapping({ "code" })
public void getCode(HttpServletRequest request, HttpServletResponse response) {
try {
//回调地址
String redirect_uri = URLEncoder.encode(
"http://www.xxoo.com/InterfaceAPI/openid?codeID=7837283",
"utf-8");
String url = "https://open.weixin.qq.com/connect/oauth2/authorize?appid="
+ WechatConfig.APP_ID
+ "&redirect_uri="
+ redirect_uri
+ "&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect";
response.sendRedirect(url);
} catch (Exception e) {
e.printStackTrace();
}
}

3.里面有一个codeid的参数,不要在意这个,是用来测试用的。这里只需要openid,下面是使用get方法获取json返回结果,获取到openid后,重定向到支付页面。

@RequestMapping({ "openid" })
public void getOpenid(String codeID, String code,
HttpServletResponse response) {
try {
String requestUrl = "https://api.weixin.qq.com/sns/oauth2/access_token?appid="
+ WechatConfig.APP_ID
+ "&secret="
+ WechatConfig.APP_SECRET
+ "&code="
+ code
+ "&grant_type=authorization_code";
if (code != null) {
String json = WebUtils.get(requestUrl, null);
WechatResult result = new Gson().fromJson(json,
WechatResult.class);
OPEN_ID = result.getOpenid();
System.out.println("====OPEN_ID====" + OPEN_ID);
response.sendRedirect("http://www.xxoo.com/InterfaceAPI/pay.html");
} } catch (Exception e) {
e.printStackTrace();
}
}

4.在前端支付页面输入要支付的金额,提交到后台

$.ajax({

                type: "POST",
dataType: "html",
url: "http://www.xxoo.com/InterfaceAPI/weixinPay",
data: "value="+self.input.value,
timeout:10000,
cache: true,
async: true,
error: function(data){
//alert(data+"---value-->"+self.input.value);
}, },});

5.后端获取金额然后在后端统一下单,公众号支付有两个地方不一样,一是支付类型要改为 JSAPI,二是需要获取openid

    @RequestMapping({ "weixinPay" })
public void weixinPay(HttpServletRequest request,
HttpServletResponse response) {
String value = request.getParameter("value");
WechatTradeTest wechat = new WechatTradeTest();
String json = wechat.testunifiedOrder(Integer.valueOf(value), OPEN_ID);
//这里返回json到前端
write(json, response);
}

6.统一下单成功后返回的结果例子:

<xml>
<return_code><![CDATA[SUCCESS]]></return_code>
<return_msg><![CDATA[OK]]></return_msg>
<appid><![CDATA[wx2421b1c4370ec43b]]></appid>
<mch_id><![CDATA[10000100]]></mch_id>
<nonce_str><![CDATA[IITRi8Iabbblz1Jc]]></nonce_str>
<openid><![CDATA[oUpF8uMuAJO_M2pxb1Q9zNjWeS6o]]></openid>
<sign><![CDATA[7921E432F65EB8ED0CE9755F0E86D72F]]></sign>
<result_code><![CDATA[SUCCESS]]></result_code>
<prepay_id><![CDATA[wx201411101639507cbf6ffd8b0779950874]]></prepay_id>
<trade_type><![CDATA[JSAPI]]></trade_type>
</xml>

7.返回的参数需要重新签名并返回到前端,签名方法与统一下单时的签名是一样的!签名时必须要带上微信商户返回是以Json格式返回到前端。

public String testunifiedOrder(int fee,String openid) {
WechatUnifiedOrder request = new WechatUnifiedOrder();
request.setBody("测试商品");
request.setDetail("一个好商品");
request.setGoods_tag("测试");
request.setOut_trade_no(System.currentTimeMillis() + "");
request.setFee_type("CNY");
request.setTotal_fee(1);
request.setSpbill_create_ip("192.168.88.26");
request.setTime_start(System.currentTimeMillis() + "");
request.setOpenid(openid);
//下单成功后返回
WechatUnifiedOrder.Response response = WechatConfig.getInstance()
.unifiedOrder(request);
response.setTime_start(request.getTime_start());
WeichatData data = new WeichatData();
data.setAppId(response.getAppid());
data.setTimeStamp(request.getTime_start());
data.setNonceStr(response.getNonce_str());
data.setPrepay_id(response.getPrepay_id());
data.setSignType("MD5");
TreeMap<String, String> requestMap = new TreeMap<String, String>();
requestMap.put("appId", response.getAppid());
requestMap.put("timeStamp", response.getTime_start());
requestMap.put("nonceStr", response.getNonce_str());
requestMap.put("package", "prepay_id="+response.getPrepay_id());
requestMap.put("signType","MD5");
data.setPaySign(sign(requestMap).toUpperCase());
return new Gson().toJson(data);
}

8.前端需要解析json,获取对应的值,唤醒微信支付

 success: function(data){
if(data!=null){
var obj=eval("("+data+")");
appId = obj["appId"];
//timeStamp = new Date().getTime();
timeStamp = obj["timeStamp"];
nonceStr = obj["nonceStr"];
package = obj["prepay_id"];
paySign = obj["paySign"];
if (typeof WeixinJSBridge == "undefined"){
if( document.addEventListener ){
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
}else if (document.attachEvent){
document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
}
}else{
onBridgeReady();
}
}else{
alert("支付失败");
}
},
    //微信回调
function onBridgeReady(){
WeixinJSBridge.invoke(
'getBrandWCPayRequest', {
"appId" :appId,
"timeStamp":timeStamp,
"nonceStr" :nonceStr,
"package" :"prepay_id="+package,
"signType" :"MD5",
"paySign" : paySign
},
function(res){
if(res.err_msg == "get_brand_wcpay_request:ok" ) { }else { }
}
);

到这里基本成功了,同时感谢一位网友的文章:http://blog.csdn.net/u012706811/article/details/52988782。

【JAVA笔记】JAVA后端实现统一扫码支付:微信篇的更多相关文章

  1. JAVA后端实现统一扫码支付:微信篇

    最近做完了一个项目,正好没事做,产品经理就给我安排了一个任务.   做一个像收钱吧这样可以统一扫码收钱的功能.   一开始并不知道是怎么实现的,咨询了好几个朋友,才知道大概的业务流程:先是开一个网页用 ...

  2. 微信公众号支付|微信H5支付|微信扫码支付|小程序支付|APP微信支付解决方案总结

    最近负责的一些项目开发,都用到了微信支付(微信公众号支付.微信H5支付.微信扫码支付.APP微信支付).在开发的过程中,在调试支付的过程中,或多或少都遇到了一些问题,今天总结下,分享,留存. 先说注意 ...

  3. C#版微信公众号支付|微信H5支付|微信扫码支付问题汇总及解决方案总结

    最近负责的一些项目开发,都用到了微信支付(微信公众号支付.微信H5支付.微信扫码支付).在开发的过程中,在调试支付的过程中,或多或少都遇到了一些问题,今天总结下,分享,留存.代码在文章结尾处,有需要的 ...

  4. java微信扫码支付Native(模式二)

    官方开发文档模式二的地址:https://pay.weixin.qq.com/wiki/doc/api/native.php?chapter=6_5 pom文件的依赖: <?xml versio ...

  5. Java微信公众平台开发之扫码支付模式一

    官方文档点击查看准备工作:已通过微信认证的公众号,必须通过ICP备案域名(否则会报支付失败)借鉴了很多大神的文章,在此先谢过了大体过程:先扫码(还没有确定实际要支付的金额),这个码是商品的二维码,再生 ...

  6. 170327、Java微信支付中的扫码支付

    微信支付现在已经变得越来越流行了,随之也出现了很多以可以快速接入微信支付为噱头的产品,不过方便之余也使得我们做东西慢慢依赖第三方,丧失了独立思考的能力,这次打算分享下我之前开发过的微信支付. 一 H5 ...

  7. Java SpringMVC实现PC端网页微信扫码支付完整版

    一:前期微信支付扫盲知识 前提条件是已经有申请了微信支付功能的公众号,然后我们需要得到公众号APPID和微信商户号,这个分别在微信公众号和微信支付商家平台上面可以发现.其实在你申请成功支付功能之后,微 ...

  8. Java之微信支付(扫码支付模式二)案例实战

    摘要:最近的一个项目中涉及到了支付业务,其中用到了微信支付和支付宝支付,在做的过程中也遇到些问题,所以现在总结梳理一下,分享给有需要的人,也为自己以后回顾留个思路. 一:微信支付接入准备工作: 首先, ...

  9. [支付]微信NATIVE扫码支付JAVA实现

    步骤: 1.预订单 2.接受微信返回的url 3.将url转为二维码显示到页面上 4.扫码支付 5.接收微信的异步通知,在这步修改订单的状态 6.收到异步通知的同时给微信返回指定数据,告知对方已成功处 ...

随机推荐

  1. 【supervisord】部署单进程服务的利器

    最近听了一场分享,里边同事介绍了一些python开发环境常用到的几种工具,其中之一就supervisord,分享后自己做了些功课,概括一下supervisord是一个什么东西呢 1. 它是一个独立的常 ...

  2. Lazy Load, 延迟加载图片的 jQuery 插件 - NeoEase

    body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...

  3. COCOS2DX遇到的问题

    1 新增类无法在别的类里面include到的问题: 去项目-> 配置属性-> C/C++-> 常规-> 附加包含目录中增加类的文件夹路径 2 新增类出现 extensions\ ...

  4. CodeForces 617C Watering Flowers

    无脑暴力题,算出所有点到圆心p1的距离的平方,从小到大排序. 然后暴力枚举p1的半径的平方,计算剩余点中到p2的最大距离的平方,枚举过程中记录答案 #include<cstdio> #in ...

  5. Ubuntu和win10双系统Grup无法引导解决方案

    通常我们经常安装双系统, 但是有时候安装完系统无法正常引导, 以下就说明Ubuntu和win10双系统, win10在grub界面不断循环的解决方案 直接在win10启动项目上按e进入编辑模式 在文档 ...

  6. nginx keepalived 主从切换

    注:  LVS + Keepalived  不知道为什么出现一个很郁闷的问题....... ------------------------------------------------------ ...

  7. iOS开发之圆角指定

    如果需要将UIView的4个角全部都为圆角,做法相当简单,只需设置其Layer的cornerRadius属性即可(项目需要使用QuartzCore框架).而若要指定某几个角(小于4)为圆角而别的不变时 ...

  8. Appium的安装和使用

    <!DOCTYPE html><html><head><title>Appium的安装和使用</title><meta http-eq ...

  9. Bestcoder #80

    首先吐槽一下,ca爷出的这套题到处都是坑,bestcoder变成besthack,Ranting已经掉得不能看了 A题: 链接:http://acm.hdu.edu.cn/showproblem.ph ...

  10. C#webbrowser控件技巧(取得javascript变量值,禁止显示脚本错误)

    C#中的webbrowser控件比较好用. 下面本人搜索整理的几个小技巧. 1. 从C#中取得javascript的变量值. using mshtml;using System.Reflection; ...