0%

微信、支付宝付款码二合一(二)

写在前面

接前面一篇,上篇最后说到的微信不能识别是因为没有域名,其实是不对的。其实是因为微信扫码支付和支付宝扫码支付不一样,不是一个http请求。是“wxp”开头的。

为此特意找到之前看到的那篇文章(已经找不到链接了,好像是少数派上面的,有兴趣可以找找看,搜关键字二维码)。

我的方案

通过分别用微信和支付宝扫文章中合成之后的付款码发现,他们的二维码在微信中就不是直接打开支付界面,而是打开带有微信付款码的页面,通过长按识别二维码进行付款。

所以对上篇中html进行改造,并将页面和二维码图片放到本博客的GitHub仓库下,通过GitHub的页面进行访问,这样微信也是可以打开的。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html>
<html>
<head>
<title>支付宝-微信扫码支付</title>
<meta charset="UTF-8"/>
</head>
<body>
<h1 id="message"></h1>
<div id="wechatPay" style="text-align: center; padding-top: 50px;">
</div>
</body>
<script>
function isAlipayOrWechat() {
var userAgent = navigator.userAgent.toLowerCase();
if(userAgent.indexOf("alipay") != -1) {
window.location.href="HTTPS://QR.ALIPAY.COM/FKX00483JOOAAMITN2W2C1";
} else if(userAgent.indexOf("micromessenger") != -1) {
document.getElementById('wechatPay').innerHTML='<img style="width:80%;" src="./wechatPay.svg"><h1 id="message">长按识别二维码向我付款</h1>';
}else{
document.getElementById('message').innerHTML="请使用支付宝或者微信扫码";
}
}
isAlipayOrWechat();
</script>
</html>

看看效果吧!

images

写在最后

而且我参考的那篇文章中,也有很多人提到,通过第三方平台进行这样的合成存在安全问题。如果自己写的并放在自己的GitHub仓库中,至少不会被别人偷偷修改掉链接地址。

当然,也许是我考虑的不周全,有建议也希望能向我提出来。