url带#号，微信支付那些坑

时间 2019-11-12

标签 url 微信支付那些栏目 HTTP/TCP 繁體版

原文原文链接

如今前端不少框架的前端路由都带#号，主要为了作到无刷新跳转页面。javascript

在微信公众号作微信支付时，配置的支付路径好比是http://www.eee.com/#/order，在调微信支付的方法时错误信息是‘URL未注册’。html

个人解决方案是，写一个专门作为微信支付的页面，ajax请求后台返回须要调取微信支付的数据（签名等信息），而后把这些信息暂存起来（能够用h5的缓存，记得支付完清掉，若是用node，能够用node的缓存，以本身的实际项目方便）。跳转到支付的页面前端

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body></body>
<script type="text/javascript">
document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
var request = {};
if (sessionStorage && sessionStorage.wechatPayRequest) {
request = JSON.parse(sessionStorage.wechatPayRequest);
}
WeixinJSBridge.invoke("getBrandWCPayRequest", {
appId : request.appId,
timeStamp : request.timeStamp,
nonceStr : request.nonceStr,
"package" : request.packageInfo,
signType : request.signType,
paySign : request.paySign
}, function(res) {
sessionStorage.wechatPayRequest = ''
if ("get_brand_wcpay_request:ok" == res.err_msg) {
// 支付成功
}else {
// 支付失败
}
});
})
</script>
</html>java

一个空的页面便可，此处package是关键字，因此须要后台返回一个新的字段代替package。node

而后处理支付成功和支付失败的回调ajax

再把这个页面在当前域名下配一个路径，好比当前项目域名是http://www.eeeee.com,就把页面域名指定为http://www.eeeee.com/pay/wechat缓存

而后在微信公众号的后台把支付路径配置为http://www.eeeee.com/pay/微信

这个方法有个缺点，就是调取支付要跳转页面，用户体验很差，支付完成还要再跳转到相应的页面。session