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

# 写在前面

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

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

# 我的方案

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

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

<!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>

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
26

看看效果吧！

images

# 写在最后

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

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

#支付宝 #微信 #扫码支付

上次更新: 2022/10/09, 14:18:05