详解JAVA后端实现统一扫码支付：微信篇

2024-03-01 18:55:03 457

最近做完了一个项目，正好没事做，产品经理就给我安排了一个任务。

做一个像收钱吧这样可以统一扫码收钱的功能。

一开始并不知道是怎么实现的，咨询了好几个朋友，才知道大概的业务流程：先是开一个网页用来判断支付平台，是微信还是支付宝，判断过后就好办了，直接照搬微信支付和支付宝的官方文档。不过微信的文档感觉有点坑，得多花点心思。

现在讲讲怎么实现微信支付网页支付，也就是公众号支付：

1.判断支付平台，在判断是微信平台时，必须使用window.location打开网页，使用其他方法在IOS版微信无法打开网页，至少现在的新版微信无法打开。对应的连接是请求获取code的链接。第2步会讲到。

<html>
<head>
<title>判断客户平台</title>
<basefontface="微软雅黑"size="2"/>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<metaname="exporter-version"content="EvernoteWindows/303244(zh-CN,DDL);Windows/6.1.7601ServicePack1(Win64);"/>
<scripttype="text/javascript"src="jquery-3.1.1.min.js"></script>
<style>
body,td{
font-family:微软雅黑;
font-size:10pt;
}
</style>
</head>
<body>
<scripttype="text/javascript">

window.onload=function(){
if(isWeiXin()){
window.location='http://www.xxoo.com/InterfaceAPI/code';
}elseif(isZFB()){
alert('支付宝即将开放....');
//varp=document.getElementsByTagName('p');
//p[0].innerHTML=window.navigator.userAgent;
}else{
alert('请使用微信或者支付宝App扫码');
}
}
functionisWeiXin(){
varua=window.navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i)=='micromessenger'){
returntrue;
}else{
returnfalse;
}
}
functionisZFB(){
varua=window.navigator.userAgent.toLowerCase();
if(ua.match(/AlipayClient/i)=='alipayclient'){
returntrue;
}else{
returnfalse;
}
}
</script>
</body></html>

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

@RequestMapping({"code"})
publicvoidgetCode(HttpServletRequestrequest,HttpServletResponseresponse){
try{
//回调地址
Stringredirect_uri=URLEncoder.encode(
"http://www.xxoo.com/InterfaceAPI/openid?codeID=7837283",
"utf-8");
Stringurl="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(Exceptione){
e.printStackTrace();
}
}

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

@RequestMapping({"openid"})
publicvoidgetOpenid(StringcodeID,Stringcode,
HttpServletResponseresponse){
try{
StringrequestUrl="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){
Stringjson=WebUtils.get(requestUrl,null);
WechatResultresult=newGson().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(Exceptione){
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"})
publicvoidweixinPay(HttpServletRequestrequest,
HttpServletResponseresponse){
Stringvalue=request.getParameter("value");
WechatTradeTestwechat=newWechatTradeTest();
Stringjson=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格式返回到前端。

publicStringtestunifiedOrder(intfee,Stringopenid){
WechatUnifiedOrderrequest=newWechatUnifiedOrder();
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.Responseresponse=WechatConfig.getInstance()
.unifiedOrder(request);
response.setTime_start(request.getTime_start());
WeichatDatadata=newWeichatData();
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=newTreeMap<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());
returnnewGson().toJson(data);
}

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

success:function(data){
if(data!=null){
varobj=eval("("+data+")");
appId=obj["appId"];
//timeStamp=newDate().getTime();
timeStamp=obj["timeStamp"];
nonceStr=obj["nonceStr"];
package=obj["prepay_id"];
paySign=obj["paySign"];
if(typeofWeixinJSBridge=="undefined"){
if(document.addEventListener){
document.addEventListener('WeixinJSBridgeReady',onBridgeReady,false);
}elseif(document.attachEvent){
document.attachEvent('WeixinJSBridgeReady',onBridgeReady);
document.attachEvent('onWeixinJSBridgeReady',onBridgeReady);
}
}else{
onBridgeReady();
}
}else{
alert("支付失败");
}
},

//微信回调
functiononBridgeReady(){
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{

}
}
);

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

详解JAVA后端实现统一扫码支付：微信篇

热门推荐

随机推荐