题记

—— 执剑天涯，从你的点滴积累开始，所及之处，必精益求精，即是折腾每?天。

重要消息

精通点的可以查看这里精述
https://gitbook.cn/gitchat/author/5ae043915efcf9715e37c733

Flutter 从入门实践到开发一个APP之UI基础篇视频
https://edu.csdn.net/course/detail/25543

flutter从入门到精通系列文章
https://blog.csdn.net/zl18603543572/article/details/93532582

1 引言

场景描述：在APP 中使?webView 显示第三?H5, H5中涉及到微信?付流程，?法正常?付，提示 "商家参数格式有误，请联系商家解决"。

参照微信H5 ?付开发官??档

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

描述?

?般提示出错，我们可以先去微信商户管理平台查看配制，

https://pay.weixin.qq.com/index.php/core/home/login?return_url=%2F

当然出错后，也不急着去商户后台去查看配制，因为在开发微信?付功能初期这些都是已经配制好的，当然是在其平台?如浏览器、Ios UIWebview 等都可以正常的调起?付，那说明在商户后台的配制是没有问题的，不过我们也可以再次去查看?下商户后台配制的具体值。

描述?

参照微信H5 ?付开发官??档常?问题

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

1 引?

1.1 线索分析

在?络发?变动的情况会出现此提示之?

也有提到 "如果是APP?调起H5?付，需要在webview中?动设置referer"，具体内容如下

那么到这?，我们可以?动的在 Android WebView 中添加头 referer ,这个请求头

简?之，HTTP Referer是header的?部分，当浏览器向web服务器发送请求的时候，?般会带上Referer，告诉服务器我是从哪个??链接过来的，服务器籍此可以获得?些信息?于处理。?如从我主?上链接到?个朋友那?，他的服务器就能够从HTTP Referer中统计出每天有多少?户点击我主?上的链接访问他的?站。
Referer其实应该是英?单词Referrer，不过拼错的?太多了，所以编写标准的?也就将错就错了

在安卓WebView中?动配制请求头 referer

然后再次使? 安卓 WebView 来加载 H5 项?，然后发起微信?付，然后发起成功

分析：

当没有在Android WebView 中添加头 referer 请求头，同样的 H5 项?，分别在在 Android WebView 、浏览器、ios UIWebVie 中访问打开，浏览器、ios UIWebVie 中，都可以正常调起?付，只有 Android WebView中微信?付调起失败，提示商家参数格式有误

当在Android WebView 中添加头 referer（这个值对应的微信商户平台后台配制的值）请求头，再次访问同样的 H5 项?，再次调起微信?付，成功。

然后使?抓包?式进?步分析：

在浏览器中对其加载?络分析

然后在 Android WebView 、ios UIWebView 中加载H5 项? 然后对 Android ios中的WebView 配制抓包代替，然后访问 H5 项?

得出结论请求头 referer 并没有丢失，然后进?步抓包分析得出结论在 Android ios 中加载 H5 项?，请求头 referer配制的信息与商户管理后台配制的??，并没有丢失或者是配制错误（当然在ios UIWebView 能?付成功也可以说明）

那么问题来了，在Android WebView 中如果不配制请求头 referer 调起失败，我们需要找出原因

在 Android WebView 中没有设置 referer 请求 header 前

        mWebView.setWebViewClient(new WebViewClient() {
            @Override

            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                
                //使用WebView加载显示url
                view.loadUrl(url);
                //返回true
                return true;
            }
            
            
            // Handle API 21+
            @TargetApi(Build.VERSION_CODES.LOLLIPOP)
            @Override
            public WebResourceResponse shouldInterceptRequest(WebView view, WebResourceRequest request) {
                ///获取请求uir
                String url = request.getUrl().toString();
                ///获取RequestHeader中的所有 key value
                Map lRequestHeaders = request.getRequestHeaders();
                for (Map.Entry lStringStringEntry : lRequestHeaders.entrySet()) {
                    Log.d("测试header", lStringStringEntry.getKey() + "  " + lStringStringEntry.getValue());
                }
                return super.shouldInterceptRequest(view, request);
            }
        });

然后在控制台中查看调起?付那?下请求的信息

对应的抓包?具中数据

分析数据得出：发起微信?付时 referer 丢失

https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id= 后?省略

然后在 Android 中?动配制 referer 后，H5 微信?付调起成功，抓包数据

        
        mWebView.setWebViewClient(new WebViewClient() {
        
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                
                try {
                    if (url.startsWith("http:") || url.startsWith("https:")) {
                        HashMap lStringStringHashMap = new HashMap<>();
                        if (!TextUtils.isEmpty(mReffer)) {
                            lStringStringHashMap.put("referer", mReffer);
                            view.loadUrl(url, lStringStringHashMap);
                        } else {
                            view.loadUrl(url, lStringStringHashMap);
                        }
                    } else {
                        Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
                        startActivity(intent);
                    }
                    return true;
                } catch (Exception e) {
                
                }
                //使用WebView加载显示url
                view.loadUrl(url);
                //返回true
                return true;
            }
            
            @Override
            public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
                handler.proceed();
            }
            
            
            // Handle API 21+
            @TargetApi(Build.VERSION_CODES.LOLLIPOP)
            @Override
            public WebResourceResponse shouldInterceptRequest(WebView view, WebResourceRequest request) {
                ///获取请求uir
                String url = request.getUrl().toString();
                ///获取RequestHeader中的所有 key value
                Map lRequestHeaders = request.getRequestHeaders();
                Log.e("测试URI",url);
                for (Map.Entry lStringStringEntry : lRequestHeaders.entrySet()) {
                    Log.d("测试header", lStringStringEntry.getKey() + "  " + lStringStringEntry.getValue());
                }
                if (lRequestHeaders.containsKey("Referer")) {
                    mReffer = lRequestHeaders.get("Referer");
                }
                return super.shouldInterceptRequest(view, request);
            }
        });

结论来了：在调微信 H5 ?付

https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb

请求头 referer 丢失。

关于 Referer 丢失的问题

?先 referer 是由客户端的浏览器发送到服务器上，且在客户端可以通过 document.referrer 来获取，也就是说referer的发送实际上是?个浏览器?为，发送与否的决定权是在浏览器??。虽然这样说，但是HTTP协议对什么情况下，浏览器该发送，什么情况下不该发送有着严格的规定。

1.当?站使?refresh字段进?跳转的时候，?多数浏览器不发送referer
2.从?户从?个HTTPS的?站点击链接到另?个HTTP的?站时，不发送referer
3.html5中，a标签的rel = "noreferrer", 可以让浏览器不发送referer
4.使?Data URI scheme链接的，浏览器也不发送referer
5.使?Content Security Policy, 也可以让浏览器不发送referer
6.在html头部中使?meta标签来控制不让浏览器发送referer
7.在发起?付的时候 android WebView 过滤了 referer，解决?式就是

///在H5项目中发起支付时 
https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb

///一般可使用 但会导致 在 android WebView 中丢失referer

下?两种?式 android WebView 中不会丢失referer


     
     
 


    document.form.method= "post";     
    document.form.action= "https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?支付信息 ";
    document.form.submit();

jQuery动态创建form表单提交

    var action='https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?支付信息 ' 
    var form = $("")
    form.attr('action', action)
    form.attr('method', 'post')
    //追加到body，不显示，然后提交
    form.appendTo("body")
    form.css('display', 'none')
    form.submit()

2.2 分析? HTTPS变HTTP

有时候需要在API项?中?成?些URL链接返回但是服务器端已经配置了?持HTTPS，通过HTTPS访问的时候?成的URL仍然是HTTP

从 HTTPS 站点跳到 HTTP 站点丢失了 Referer，反过来从HTTP到HTTPS是没问题的不会丢失 Referer

从前端请求到 API 整个都没有问题全部项?已经全线部署了 HTTPS , Referer 信息也有携带然后只有到最后?步微信的?付请求URL的时候 Referer 就丢失了

Android WebView 调起H5支付，提示商家参数格式有误

1 引言

描述?

描述?

1 引?

1.1 线索分析

分析：

关于 Referer 丢失的问题

2.2 分析? HTTPS变HTTP

相关推荐

前端Flex布局可视化布局工具介绍，vue和html5快速设计利器

HTML 简介（html简介及优缺点）

现在页面实时聊天都使用Websocket技术实现吗?

关于HTML5被简称做H5，你怎么看?（html5缩写）

在SpringBoot+Vue3项目中通过Nginx代理WebSocket实现跨域通信

利用webSocket实现消息的实时推送

谈谈websocket跨域

前端开发规范(一、HTML篇)

html5 工业web组态-开发自定义的组件 (炫酷按钮)

Python每日一库之Beautiful Soup（python mtime）