H5微信支付webview设置referer无效问题总结

最近在接入H5微信支付时遇到了一个比较坑的问题，所以写篇总结

问题描述

在接入H5微信支付时，如果是APP里调起H5支付，需要在webview中手动设置referer，如下

Map extraHeaders = new HashMap();
extraHeaders.put("Referer", "商户申请H5时提交的授权域名");//例如 http://www.baidu.com webView.loadUrl(targetUrl, extraHeaders);//targetUrl为微信下单地址

因为微信要验证请求来源，所以如果这个地方没有去设置的话，会跳转如下页面中



但是测试过程中发现一个兼容性问题：在4.4.4、4.4.3的设备上，下单时一直会跳转到上面的页面中。后来通过抓包发现设置的Referer没有生效。。。

解决方案

google了一大圈最终发现了一个靠谱的解决方案，就是利用loadDataWithBaseURL方法代替loadUrl方法，通过js去请求微信下单Url，loadDataWithBaseURL方法的具体描述如下

public void loadDataWithBaseURL(String baseUrl, String data, String mimeType, String encoding, String historyUrl)

data可以是Html代码片。baseUr为页面的基础Url，用来组织html中的相对路径。我们data这个参数中传入js代码片去请求微信下单Url，而baseUr设置为授权域名，这样请求微信下单Url时，referer自动会被设置为baseUrl（正常请求的referer默认就是请求的来源地址）

最终的代码如下

if (("4.4.3".equals(android.os.Build.VERSION.RELEASE))
|| ("4.4.4".equals(android.os.Build.VERSION.RELEASE))) {
//兼容这两个版本设置referer无效的问题
view.loadDataWithBaseURL("商户申请H5时提交的授权域名",
"<script>window.location.href=\"" + targetUrl + "\";</script>",
"text/html", "utf-8", null);
} else {
Map<String, String> extraHeaders = new HashMap<>();
extraHeaders.put("Referer", "商户申请H5时提交的授权域名");
view.loadUrl(targetUrl, extraHeaders);
}

希望本文能帮助到遇到相同问题的程序员们

微信H5支付常见问题汇总

https://pay.weixin.qq.com/wiki/doc/api/H5.php?chapter=15_4

最后感谢提供本方案的大佬，他写的文章地址如下

https://www.jianshu.com/p/8e138577ec8e