需求背景:
需要在用户点击提交按钮的时候拦截用户提交的数据。
遇到的问题:
1.页面不是自家前端做的,不能修改网页中的代码
2.要拦截的请求不是get请求,而是一个post请求 (难点在于:如果拦截的请求是get请求的话,我只需要拿到url,将后面拼接的参数键值对取出来就好了,但是post请求的参数键值对我们是看不到的。。。)
解决重点:
重写webViewClient的shouldInterceptRequest这个方法
1.这个方法是API21以后才出现的,还有一个过时的方法也要重写,不要忘了!
2.在加载网页时,所有的资源都会经过shouldInterceptRequest这个方法,我们可以通过shouldInterceptRequest和抓包工具(Fidder,Charles)去获取你想要获取信息的网址和资源文件
3.这个方法是执行在子线程的,如果你想要更新UI的话,记得切换线程
解决方案:
我这里找到了两种解决方案(总有一款适合你)
方案A : 适合 精通js 的大大们
1.拦截页面上按钮的点击事件,将点击事件的操作进行替换
|
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
27
28
29
30
31
32
33
|
$('#J_submit').off('click'); //1.将id为J_submit的按钮点击事件关闭$('#J_submit').on('click',function(){ //2.将id为J_submit的按钮点击事件重新打开,并执行function里的内容 if ($(this).hasClass("btn-disabled")) { // ----- 此处为原页面代码,不做解释 ----- return; } try { trackDealerEvent('dlr_order_page_form_submit_click', { 'esfrom': _mediaId, 'business': 'songshu', 'series': _seriesId, 'city': _cityId }); } catch (e) { console.log(e); } // ----- 此处为原页面代码,不做解释 ----- var pageFormData = validateAllField(alertDiv); if (pageFormData) { //3.获取到页面内的数据 $.ajax({ //4.ajax方式上传到服务器中 url: 'https://gouche.jxedt.com/gouche/clue/submit', data: { cityid: _cityId, brandid: _brandId, seriesid: _seriesId, classesid: _specId, name: $("[name='userName']").val(), phone: $('#phoneNumber').val(), type: 4 } }); postOrder(pageFormData); }}) |
2.动态的加载一段js代码
|
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
27
28
29
30
31
32
33
|
mCommonWebView.setCommonWebViewClient(new CommonWebViewClient() { //添加自定义的 WebViewClient @Override public void onPageFinished(WebView view, String url) { //重写onPageFinished方法 super.onPageFinished(view, url); //请求js的网址 runRemoteJs(Constant.QueryCarPrice.loadJsUrl_CarHome); } private void runJs(String remoteJs){ //把获取到的js代码添加到当前网页 if(TextUtils.isEmpty(remoteJs)) { return; } String js = "javascript:"; //作用:指明字符串后面的都是js代码 js+= "var script = document.createElement('script');"; // 作用:创建script节点 js+= "script.type = 'text/javascript';"; js+=remoteJs; mCommonWebView.callJsFunction(js); //加载js代码 } private void runRemoteJs(String url) {//前端大大提供的一个网址,网址里面就是上面的js代码,将网页中的代码获取下来 RxRequest<String> request = new RxRequest<String>() .setUrl(url) .setMethod(Request.Method.GET); RxHttpEngineWrapper.commonExec(request) .subscribeOn(AndroidSchedulers.mainThread()) .subscribe(new UtilsRx.DefaultSubscriber<String>(){ @Override public void onNext(String s) { runJs(s); } }); }}); |
3.到时候只要前端的大大修改页面中的js就可以了
此方案的坑:
1.要加载的js代码中不能包含script节点
2.要加载的js代码中不能有注释
3.要加载的js代码一定要加上分号
*如果不满足上面的三点要求,要加载的js都不能正确的执行
方案B : 原生的Android方式,相对于上一种方案,这种方案比较麻烦
1.重写shouldInterceptRequest去拦截资源
2.将第三方网页上进行网络请求的js页面下载下来(就是把网页的所有下载下来,找到进行网络请求的js页),对js页进行修改
3.将处理好的js页加载到本地,以后加载时就利用本地的js替换第三方的js(我会在本地的js页面中添加与webview沟通的桥梁)
|
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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
|
//以下为具体操作,我把具体的方法贴了上去,如果不太懂的可以看看代码,我写了注释 //初始化WebViewprivate void initWebView() { mWebView.getSettings().setDomStorageEnabled(true); mWebView.getSettings().setDefaultTextEncodingName("utf-8"); if(Build.VERSION.SDK_INT >=21){//Added in API level 21 mWebView.getSettings().setMixedContentMode(android.webkit.WebSettings.MIXED_CONTENT_ALWAYS_ALLOW); } mWebView.getSettings().setJavaScriptEnabled(true); mWebView.getSettings().setUseWideViewPort(true); //设置webview推荐使用的窗口，使html界面自适应屏幕 mWebView.getSettings().setLoadWithOverviewMode(true); mWebView.getSettings().setGeolocationEnabled(true); mWebView.getSettings().setAllowFileAccess(true); if (Build.VERSION.SDK_INT >= 16) { //屏蔽Webview的跨域漏洞 mWebView.getSettings().setAllowFileAccessFromFileURLs(false); mWebView.getSettings().setAllowUniversalAccessFromFileURLs(false); } mWebView.getSettings().setPluginState(WebSettings.PluginState.ON); if (Build.VERSION.SDK_INT >= 11) { mWebView.getSettings().setAllowContentAccess(true); } mWebView.loadUrl(currUrl); mWebView.setWebViewClient(new MyWebViewClient()); //与js通讯的桥梁 mWebView.addJavascriptInterface(new StubClass(),"stub"); } public class MyWebViewClient extends WebViewClient { /*两个shouldInterceptRequest方法体中的内容大致相同,因为是demo,我也没有抽取方法*/ @Override public WebResourceResponse shouldInterceptRequest(WebView view, String url) { //获取的请求参数的 Map 集合 HashMap<String,String> params; Uri uri=Uri.parse(url); //获取网址对应的Uri if (rightUrl(uri.toString())) { /*get请求获取参数*/ params=paramForGET(uri); /*重头戏,post请求获取参数*/ /* * 获取post请求参数的思路就是: * 找到其网址中进行网络请求的js代码,对这段js代码进行替换 * 我采取的是拦截第三方网址上请求数据的js资源,将本地的资源提交上去替换原资源 */ if (uri.toString().contains("index.js")) { //拦截该网页下对应的js资源并进行替换 try { //WebResourceResponse的构造器三个参数作用 String mimeType:指定替换资源的类型 String encoding:字符集 InputStream input:输入流 return new WebResourceResponse("application/x-javascript","UTF-8",getAssets().open("index.js")); } catch (IOException e) { e.printStackTrace(); } } } return super.shouldInterceptRequest(view, url); } //API21及21以后才支持此方法 @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP) @Override public WebResourceResponse shouldInterceptRequest(WebView view, WebResourceRequest request) { //获取的请求参数的 Map 集合 HashMap<String,String> params; String method=request.getMethod(); //当前网址的提交方式 Map<String, String> requestHeaders = request.getRequestHeaders(); //获取请求头 Uri uri=request.getUrl(); //获取网址对应的Uri if (rightUrl(uri.toString())) { /*get请求获取参数*/ params=paramForGET(uri); /*重头戏,post请求获取参数*/ /* * 获取post请求参数的思路就是: * 找到其网址中进行网络请求的js代码,对这段js代码进行替换 * 我采取的是拦截第三方网址上请求数据的js资源,将本地的资源提交上去替换原资源 */ if (uri.toString().contains("index.js")) { //拦截该网页下对应的js资源并进行替换 try { //WebResourceResponse的构造器三个参数作用 String mimeType:指定替换资源的类型 String encoding:字符集 InputStream input:输入流 return new WebResourceResponse("application/x-javascript","UTF-8",getAssets().open("index.js")); } catch (IOException e) { e.printStackTrace(); } } } return super.shouldInterceptRequest(view, request); } private boolean rightUrl(String url){ if (url.contains(COLLECT_URL)) //判断资源网址是否是我需要的 return true; return false; } private HashMap<String,String> paramForGET(Uri uri){ HashMap<String,String> params=new HashMap<>(); Set<String> paramNames = uri.getQueryParameterNames(); //获取此get请求中所有的参数名 /*我这里是将所有的参数都填了进去,大家在获取的时候可以进行筛选和过滤*/ for (String param : paramNames) { params.put(param,uri.getQueryParameter(param)); //存储键值对 } return params; }} public class StubClass{ @JavascriptInterface public void getData(String json){ Log.i("xxx","json -> "+json); }} |
这是我本地的js，对原来的js进行了修改，添加了与Android通讯的桥梁，来截取数据。
补充知识：android WebView使用Post请求和设置浏览器弹框
这里要注意：post请求参数只能传byte数组，而且必须是键值对字符串形式的byte数组，其中的key是后台服务器接收key，后台规定key是什么值就是什么值，不能随意更改，没有key=value格式或者key不正确，都会请求不到数据网页打不开。
下面代码直接看initWebView()方法就好
|
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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
|
package com.xxxxx.xxx.activity.banksign; import org.json.JSONException;import org.json.JSONObject; import android.app.AlertDialog;import android.content.DialogInterface;import android.graphics.Bitmap;import android.os.Bundle;import android.util.Log;import android.view.KeyEvent;import android.view.View;import android.view.View.OnClickListener;import android.webkit.JsResult;import android.webkit.WebChromeClient;import android.webkit.WebSettings;import android.webkit.WebView;import android.webkit.WebViewClient; import com.xinzong.etc.R;import com.xinzong.xx.base.BaseGestureActivty;import com.xinzong.xxx.utils.ShowReloadUtil;/** * * @author * */public class WebViewActivity extends BaseGestureActivty implements OnClickListener{ private ShowReloadUtil reloadUtil; private String url = "http://120.1.1.1/xx/xxxx"; private WebView webView; private String urlParameter = ""; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_sign_webview); findViewById(R.id.ibBack).setOnClickListener(this); //获取传过来的支付参数 urlParameter = getIntent().getStringExtra("urlParameter"); Log.i("TAG", urlParameter); //初始化重新加载框 reloadUtil = new ShowReloadUtil(this); reloadUtil.setReloadView(this, R.id.ll_show_data_mc, R.id.rl_reload_parent_mc); //刷新界面，加载webview refresh(); } private void refresh() { if(isNetworkConnected()){ findView(R.id.webview1).setVisibility(View.VISIBLE); reloadUtil.showDataView(); initWebView(); }else{ findView(R.id.webview1).setVisibility(View.GONE); reloadUtil.showReload(); } } private void initWebView() { webView = (WebView) findViewById(R.id.webview1); //初始化webview //启用支持javascript WebSettings settings = webView.getSettings(); settings.setJavaScriptEnabled(true);//支持javaScript settings.setDefaultTextEncodingName("utf-8");//设置网页默认编码 settings.setJavaScriptCanOpenWindowsAutomatically(true); Log.d("TAG", "url:"+url); //post请求(使用键值对形式，格式与get请求一样，key=value,多个用&连接) urlParameter = "JSONpriKey=" +urlParameter; webView.postUrl(url, urlParameter.getBytes());// webView.loadUrl(url);//get webView.setWebChromeClient(new MyWebChromeClient());// 设置浏览器可弹窗 //覆盖WebView默认使用第三方或系统默认浏览器打开网页的行为，使网页用WebView打开 webView.setWebViewClient(new WebViewClient(){ @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { //返回值是true的时候控制去WebView打开，为false调用系统浏览器或第三方浏览器 Log.d("TAG", "url:"+url); view.loadUrl(url); return true; } @Override public void onPageStarted(WebView view, String url, Bitmap favicon) { Log.d("TAG", "onPageStarted--url:"+url); //支付完成后,点返回关闭界面 if(url.endsWith("http://120.1.1.1/xxx/xx/xxx")){ finish(); } super.onPageStarted(view, url, favicon); } @Override public void onPageFinished(WebView view, String url) { super.onPageFinished(view, url); } }); } @Override public void onClick(View v) { if (v.getId() == R.id.btnReload) {// 点击 ‘重新加载' reloadUtil.showClickloadingView(); Log.d("TAG", "RELOAD"); if (this.isNetworkConnected()) { webView.loadUrl(url); } else { reloadUtil.showReload(); } }else if(v.getId() == R.id.ibBack){ if(webView !=null && webView.canGoBack()){ webView.goBack(); }else{ finish(); } } } @Override public boolean onKeyDown(int keyCode, KeyEvent event) { if(keyCode == KeyEvent.KEYCODE_BACK && webView !=null && webView.canGoBack()){ webView.goBack(); return true; } return super.onKeyDown(keyCode, event); } /** * 浏览器可弹窗 * * @author Administrator * */ final class MyWebChromeClient extends WebChromeClient { @Override public boolean onJsConfirm(WebView view, String url, String message, final JsResult result) { new AlertDialog.Builder(CTX) .setTitle("App Titler") .setMessage(message) .setPositiveButton(android.R.string.ok, new DialogInterface.OnClickListener() { public void onClick(DialogInterface dialog, int which) { result.confirm(); } }) .setNegativeButton(android.R.string.cancel, new DialogInterface.OnClickListener() { public void onClick(DialogInterface dialog, int which) { result.cancel(); } }).create().show(); return true; } } } |
以上这篇Android WebView通过动态的修改js去拦截post请求参数实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持服务器之家。
原文链接：https://blog.csdn.net/xp_code/article/details/79260390
