0%

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

写在前面

前段时间,看到有网站可以将微信和支付宝的付款码合并成一个,觉得很有意思,但是在我准备尝试的时候发现是收费的。

作为一个天天付钱不收钱的,这就没有必要了。其实之前在店里面扫码付钱的时候好像就见过这样的付款码。

今天突发奇想,作为一个码农,自己就可以写一个呀。

思路

二合一无非就是微信或者支付宝扫码打开的都是同一个服务请求。服务器接收到请求的时候根据如request中的useragent进行判断。根据判断结果将请求重定向到对应app的地址。

过程

这样分析之后我们就需要知道支付宝和微信的useragent都是什么。通过网上查询知道支付宝的useragent中有Alipay,微信的useragent中有micromessenger。

然后就自己动手,在之前搭建的一个web项目中新增加一个方法。

代码完成之后在浏览器访问发现没有反应。将请求地址(局域网地址)生成为二维码。使用手机(与电脑在同一局域网)支付宝扫码测试发现可以打开,微信扫码会提示不是域名访问。处于安全考虑不允许打开。

这么看方法应该是对的,可惜没有买域名和vps,这个也是能自己这么玩玩了。

之后

因为微信要是进行服务端重定向需要域名才行,只能到此为止了。

之后突然想到,也可以通过js进行前端的判断,之后通过window.location.href进行“重定向”。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<html>
<head>
<meta charset="UTF-8"/>
</head>
<body>
<h1 id="message"></h1>
</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) {
window.location.href="wxp://f2f0fHq8R3hDDhWV4a6sKZrb5_EF0CGMljOP";
}else{
document.getElementById('message').innerHTML="请使用支付宝或者微信扫码";
}
}
isAlipayOrWechat();
</script>
</html>

用nginx在局域网测试发现支付宝是可以成功的。微信前面说了有限制,也就没有尝试了

这样只要一个html就可以,比如可以把这个html放到这个博客里面,这样不就不需要买域名和vps了。

可是当我把文件放到博客之后,还是支付宝可以成功。微信扫码打开就只是一个空白页。看来微信做了限制,不允许通过window.location.href来指定页面请求。

最后

目前这个功能也就这样了,后面有机会买了vps和域名,再试试吧,先记一下。