APP内嵌网页使用微信或支付宝的H5支付

时间:2024-10-10 11:28:15

如何绕过微信或支付宝的H5支付的拦截验证?下面我们从本质上来说明该如何解决这个问题。

微信和支付宝的H5支付下单成功后都会返回一个跳转支付的url连接,通过这个连接可以拉起微信或支付宝进行支付操作。

如果直接访问,支付宝会有一个中间的页面,而微信有个麻烦的refresh验证问题;那么是否可以跳过这个步骤直接将微信支付宝拉起进行支付呢?

网上大部分的教程都是让做安卓和IOS的自己去拦截微信和支付宝的地址进行处理。但是对这种内嵌网页,特别是那种直接通过前端HTML代码生成多端的情况,前端的同学就非常不好操作了; 那么这个活就需要后端的同学辛苦哈来解决了(ง •_•)ง。

首先需要知道的是每一个手机APP都有一个唯一的URL Scheme地址,访问这个地址即可将对应的APP打开。基于这个原理,那么微信和支付宝的支付最终肯定也是基于此来实现将其APP拉起然后让用户进行支付的。

因此让后端对支付地址处理下,直接返回可以拉起微信和支付宝的支付URL Scheme;这样就可以直接用了,微信的refresh验证也可以跳过了。

首先是微信H5支付

通过程序直接请求微信H5支付下单返回的支付链接,返回如下(下面是返回的部分html代码):

在Html代码中有以weixin://开头的链接;而weixin://正好是微信的URL Scheme,这个就是之后调用微信支付的链接,在手机浏览器上打开这个链接正好可以调起微信支付进行支付。
说明微信在这个页面上并没有做其他的骚操作,那些Referer拦截只是一些简单的前台拦截。那么我们通过后端程序直接去请求微信返回H5支付链接,然后将返回的HTML中的微信支付URL Scheme提取出来直接返回给前端即可。

下面是Java示例代码
HttpHeaders headers = new HttpHeaders();
headers.add("Host", "");
headers.add("Accept-Language", "en, zh-CN; q=0.8,zh; q=0.6,en-US; q=0.4");
headers.add("Accept", "text/html,application/xhtml+xml, application/xml ; g=0. 9 ,image/webp,*/* ; q=0.8");
headers.add("Upgrade-Insecure-Requests", "1");
// 这个地方写你自己在微信支付后台配置的安全域名
headers.add("Referer", "");
HttpEntity<String> httpEntity = new HttpEntity<>(headers);

try{
   
    // 使用spring的 RestTemplate; mweb_url是微信的H5支付链接
    ResponseEntity<String> exchange = this.restTemplate.exchange(mweb_url, HttpMethod.GET, httpEntity,