WebView的知识

一、基本介绍

WebView是一个显示页面的组件。

二、基本使用

访问网页需要网络，所以在AndroidManifest.xml文件中添加网络权限。

<uses-permission android:name="android.permission.INTERNET" />

可以使用Intent跳转网页，使用如下：

Uri uri = Uri.parse("http://www.baidu.com");
Intent intent = new Intent(Intent.ACTION_VIEW, uri);
startActivity(intent);

使用Intent跳转网页，会调用本地的浏览器来查看网页信息。

在onCreate()方法中将contentView设置为webView，方法如下：

WebView webView = new WebView(this);
setContentView(webView);
loadUrl("http://www.baidu.com");

这种方法，整个界面都是网页内容。

还有一种就是将webView作为整个界面的一个组件，在activity_main中添加WebView组件，如下：

    <WebView
        android:id="@+id/web_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

在MainActivity.java中使用WebView，代码如下：

webView = (WebView) findViewById(R.id.web_view);
webView.loadUrl("http://www.baidu.com");

三、设置支持JavaScript

如果网页中使用了JavaScript，不设置支持JavaScript的话，网页不能正常的显示，如果当网页中使用了JavaScript，需要设置支持JavaScript。

//启动支持javascript
webView.getSettings().setJavaScriptEnabled(true);

四、点击返回键时希望浏览的网页后退而不是退出浏览器

当希望点击返回键之后浏览的网页回退一页，而不是直接退出浏览器，就需要重写onKeyDown函数，调用WebView的geBack()方法来回退一页。

    //改写返回键的逻辑
    //希望点击回退键网页回退也不是退出浏览器
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK) {
            if (webView.canGoBack()) {
                webView.goBack();//返回上一个页面
                return true;
            } else {
                System.exit(0);//退出程序
            }
        }
        return super.onKeyDown(keyCode, event);
    }

五、判断页面加载过程

设置WebView的WebChromeClient()方法来判断页面的加载情况。当浏览器的UI发生改变时，比如，进度更新和JavaScript警报都会发送到WebChromeClient类中。也可以拦截URL加载在这个（使用shouldoverrideurlloading()方法）。

        //网页加载过程
        webView.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                Toast.makeText(MainActivity.this, "newProgress = " + newProgress, Toast.LENGTH_SHORT).show();
                if (newProgress == 100) {
                    //网页加载成功
                    //Toast.makeText(MainActivity.this,"网页加载成功",Toast.LENGTH_SHORT).show();
                } else {
                    //Toast.makeText(MainActivity.this,"网页加载失败",Toast.LENGTH_SHORT).show();
                }
            }
        });

但是当进入时，newProgress等于10的时候，网页已经显示出来，使用这个方法来判断加载情况，个人感觉不是很可靠。

六、页面缓存

WebView的缓存类型有两种：

第一种：浏览器自带的网页数据缓存。

浏览器缓存机制是通过HTTP协议Header里的Cache-Control（或Expires）和Last-Modified（或 Etag）等字段来控制文件缓存的机制。

接收响应时，根据Cache-Control（或Expires）浏览器决定文件是否需要被缓存，或者需要加载文件时，浏览器决定是否需要发出请求的字段。

发起请求时，根据Last-Modified（或 Etag）服务器决定文件是否需要更新的字段。

通过设置WebView的Cache Mode，从而使得协议生效或者无效。

WebView的Cache Mode：

LOAD_CACHE_ONLY：不使用网络，只读取本地缓存数据。

LOAD_DEFAULT：根据cache-control决定是否从网络上取数据。

LOAD_CACHE_NORMAL：API level 17中已经废弃，从API level 11开始作用同LOAD_DEFAULT模式。

　　 LOAD_NO_CACHE: 不使用缓存，只从网络获取数据。

　　 LOAD_CACHE_ELSE_NETWORK，只要本地有，无论是否过期，或者no-cache，都使用缓存中的数据。本地没有缓存时才从网络上获取。

WebView缓存使用：

//设置webView的缓存模式为：根据cache-control决定是否从网络上取数据
webView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);

第二种：H5的缓存

写Web页面代码是，指定manifest属性即可让页面使用App Cache。

AppCache工作的原理：当一个设置了manifest文件的html页面被加载时，CACHE MANIFEST指定的文件就会被缓存到浏览器的App Cache目录下面。当下次加载这个页面时，会首先通过manifest已经缓存过的文件，然后发起一个加载xxx.appcache文件的请求到服务器，如果xxx.appcache文件没有被修改过，那么服务器会返回304 Not Modified给到浏览器，如果xxx.appcache文件被修改过，那么服务器会返回200 OK，并返回新的xxx.appcache文件的内容给浏览器，浏览器收到之后，再把新的xxx.appcache文件中指定的内容加载过来进行缓存。

WebView支持AppCache：

        //支持AppCache
        WebSettings webSettings = webView.getSettings();
        webSettings.setAppCacheEnabled(true);
        String cachePath = getApplicationContext().getCacheDir().getPath();
        webSettings.setAppCachePath(cachePath);

两种方法的差异：

相同点

　　WebView自带的缓存和AppCache都是可以用来做文件级别的缓存的，基本上比较好地满足对于非覆盖式的js、css等文件更新。

不同点

　　WebView自带的缓存是是协议层实现的（浏览器内核标准实现，开发者无法改变）；而AppCache是应用层实现的。

　　WebView的缓存目录在不同系统上可能是不同的；而对于AppCache而言，AppCache的存储路径虽然有方法设置，但是最终都存储到了一个固定的内部私有目录下。

　　WebView自带的缓存可以在缓存生效的时候不用再发HTTP请求；而AppCache一定会发出一个manifest文件的请求。

　　WebView自带的缓存可以通过设置CacheMode来改变WebView的缓存机制；而AppCache的缓存策略是由manifest文件控制的，也就是说是由web页面开发者控制的。

很多时候，这两类缓存是共同在工作的，当manifest文件没有控制某些资源加载时，这些资源就会走到WebView自带的缓存机制去，结合WebView的CacheMode。

完整代码地址：https://github.com/ZhangMiao147/WebViewCacheDemo

参考文章：http://cs.szpt.edu.cn/android/reference/android/webkit/WebView.html

　　        http://unclechen.github.io/2017/05/13/WebView%E7%BC%93%E5%AD%98%E5%8E%9F%E7%90%86%E5%88%86%E6%9E%90%E5%92%8C%E5%BA%94%E7%94%A8/