Android WebView緩存問題

本節(jié)引言：

現(xiàn)在很多門戶類信息網(wǎng)站，比如虎嗅，ifanr，鈦媒體等等的APP，簡單點說是信息閱讀類的APP，很多 都是直接嵌套一個WebView用來顯示相關(guān)資訊的，這可能就涉及到了WebView的緩存了！

所謂的頁面緩存 就是指：保存加載一個網(wǎng)頁時所需的HTML，JS，CSS等頁面相關(guān)的數(shù)據(jù)以及其他資源，當沒網(wǎng)的時候或者 網(wǎng)絡狀態(tài)較差的時候，加載本地保存好的相關(guān)數(shù)據(jù)！而實現(xiàn)這個緩存的方式有兩種，一種是后臺寫一個 下載的Service，將文章相關(guān)的數(shù)據(jù)按自己的需求下載到數(shù)據(jù)庫或者保存到相應文件夾中，然后下次加載 對應URL前先判斷是否存在本地緩存，如果存在優(yōu)先加載本地緩存，不存在則執(zhí)行聯(lián)網(wǎng)請求，同時緩存 相關(guān)資源，典型的如舊版本的36Kr，在進去后會先離線文章，然后再顯示！

當然，本節(jié)要講解的不是 這種自己寫邏輯的方式，而是通過WebView本身自帶的緩存功能來緩存頁面，這種方式使用起來非常 簡單，我們只需為WebView設置開啟相關(guān)功能，以及設置數(shù)據(jù)庫的緩存路徑即可完成緩存！具體的 實現(xiàn)我們下面一一道來~

1.緩存的分類：

首先要說的一點是緩存的分類，我們緩存的數(shù)據(jù)分為：頁面緩存和數(shù)據(jù)緩存

• 頁面緩存：加載一個網(wǎng)頁時的html、JS、CSS等頁面或者資源數(shù)據(jù)，這些緩存資源是由于瀏覽器 的行為而產(chǎn)生，開發(fā)者只能通過配置HTTP響應頭影響瀏覽器的行為才能間接地影響到這些緩存數(shù)據(jù)。 而緩存的索引放在：/data/data//databases 對應的文件放在：/data/data/package_name/cache/webviewCacheChromunm下

• 數(shù)據(jù)緩存：分為AppCache和DOM Storage兩種 我們開發(fā)者可以自行控制的就是這些緩存資源，

• AppCache：我們能夠有選擇的緩沖web瀏覽器中所有的東西，從頁面、圖片到腳本、css等等。 尤其在涉及到應用于網(wǎng)站的多個頁面上的CSS和JavaScript文件的時候非常有用。其大小目前通常是5M。 在Android上需要手動開啟（setAppCacheEnabled），并設置路徑（setAppCachePath）和容量 （setAppCacheMaxSize），而Android中使用ApplicationCache.db來保存AppCache數(shù)據(jù)！

• DOM Storage：存儲一些簡單的用key/value對即可解決的數(shù)據(jù)，根據(jù)作用范圍的不同，有Session Storage和Local Storage兩種，分別用于會話級別的存儲（頁面關(guān)閉即消失）和本地化存儲（除非主動 刪除，否則數(shù)據(jù)永遠不會過期）在Android中可以手動開啟DOM Storage（setDomStorageEnabled）， 設置存儲路徑（setDatabasePath）Android中Webkit會為DOMStorage產(chǎn)生兩個文件（my_path/localstorage/http_blog.csdn.net_0.localstorage和my_path/Databases.db）

好吧，看完上面，是不是想說一句，臥槽，什么鬼，好復雜的樣子 當然，不要去背，知道有這些東西就好了，實際開發(fā)用到再慢慢考究，而且我們一般只關(guān)心如何 為WebView設置緩存以及如何刪除緩存！ 我們可以看下我們下面寫的demo運行后的文件結(jié)構(gòu)，打開DDMS的File Explorer：

嘿嘿，一目了然是吧~，對了另外還要說下幾種緩存的模式：

• LOAD_CACHE_ONLY: 不使用網(wǎng)絡，只讀取本地緩存數(shù)據(jù)
• LOAD_DEFAULT: 根據(jù)cache-control決定是否從網(wǎng)絡上取數(shù)據(jù)。
• LOAD_CACHE_NORMAL: API level 17中已經(jīng)廢棄, 從API level 11開始作用同LOAD_DEFAULT模式
• LOAD_NO_CACHE: 不使用緩存，只從網(wǎng)絡獲取數(shù)據(jù).
• LOAD_CACHE_ELSE_NETWORK，只要本地有，無論是否過期，或者no-cache，都使用緩存中的數(shù)據(jù)。

總結(jié)：根據(jù)以上兩種模式，建議緩存策略為，判斷是否有網(wǎng)絡，有的話，使用LOAD_DEFAULT， 無網(wǎng)絡時，使用LOAD_CACHE_ELSE_NETWORK。

接下來堆碼時間！

2.為WebView開啟緩存功能

下面我們就來為WebView開啟緩存功能，先來看下實現(xiàn)的效果圖：

運行效果圖：

流程解析： 1.進入頁面后默認加載url，然后隨便點擊一個鏈接跳到第二個頁面，退出APP 2.關(guān)閉wifi以及移動網(wǎng)絡，然后重新進入，發(fā)現(xiàn)無網(wǎng)絡的情況下，頁面還是加載了， 打開第一個鏈接也可以加載，打開其他鏈接就發(fā)現(xiàn)找不到網(wǎng)頁！ 3.點擊清除緩存，把應用關(guān)閉，重新進入，發(fā)現(xiàn)頁面已經(jīng)打不開！

接下來是代碼實現(xiàn)：MainActivity.java:

public class MainActivity extends AppCompatActivity {

    private WebView wView;
    private Button btn_clear_cache;
    private Button btn_refresh;
    private static final String APP_CACHE_DIRNAME = "/webcache"; // web緩存目錄
    private static final String URL = "http://blog.csdn.net/coder_pig";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        wView = (WebView) findViewById(R.id.wView);
        btn_clear_cache = (Button) findViewById(R.id.btn_clear_cache);
        btn_refresh = (Button) findViewById(R.id.btn_refresh);
        wView.loadUrl(URL);
        wView.setWebViewClient(new WebViewClient() {
            //設置在webView點擊打開的新網(wǎng)頁在當前界面顯示,而不跳轉(zhuǎn)到新的瀏覽器中
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return true;
            }
        });
        WebSettings settings = wView.getSettings();
        settings.setJavaScriptEnabled(true);
        //設置緩存模式
        settings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
        // 開啟DOM storage API 功能
        settings.setDomStorageEnabled(true);
        // 開啟database storage API功能
        settings.setDatabaseEnabled(true);
        String cacheDirPath = getFilesDir().getAbsolutePath() + APP_CACHE_DIRNAME;
        Log.i("cachePath", cacheDirPath);
        // 設置數(shù)據(jù)庫緩存路徑
        settings.setAppCachePath(cacheDirPath);
        settings.setAppCacheEnabled(true);
        Log.i("databasepath", settings.getDatabasePath());

        btn_clear_cache.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                wView.clearCache(true);
            }
        });

        btn_refresh.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                wView.reload();
            }
        });
    }

    //重寫回退按鈕的點擊事件
    @Override
    public void onBackPressed() {
        if(wView.canGoBack()){
            wView.goBack();
        }else{
            super.onBackPressed();
        }
    }
}

代碼很簡單，我們做的僅僅是開啟緩存的功能，以及設置緩存模式以及緩存的數(shù)據(jù)的路徑而已！

3.刪除WebView的緩存數(shù)據(jù)

上面的示例，我們通過調(diào)用WebView的clearCache(true)方法，已經(jīng)實現(xiàn)了對緩存的刪除！ 除了這種方法外，還有下述方法：

• setting.setCacheMode(WebSettings.LOAD_NO_CACHE);
• deleteDatabase("WebView.db");和deleteDatabase("WebViewCache.db");
• webView.clearHistory();
• webView.clearFormData();
• getCacheDir().delete();
• 手動寫delete方法，循環(huán)迭代刪除緩存文件夾！

當然，前面也說，我們能這直接操作的只是數(shù)據(jù)部分，而頁面緩存是由于瀏覽器 的行為而產(chǎn)生，我們只能通過配置HTTP響應頭影響瀏覽器的行為才能間接地影響到 這些緩存數(shù)據(jù)。所以上述的方法僅僅是刪除的數(shù)據(jù)部分的緩存！

4.示例代碼下載：

WebViewDemo7.zip：下載 WebViewDemo7.zip

5.本節(jié)小結(jié)：

好的，本節(jié)關(guān)于WebView緩存問題就到這里，這里只是寫了如何為WebView開啟緩存， 以及刪除緩存，以后遇到再慢慢考究，這里有個映像先~嗯，就說這么多~謝謝 

對了，差點忘了貼下本節(jié)的參考鏈接：

Android webView 緩存 Cache + HTML5離線功能 解決

Android記錄25-WebView實現(xiàn)離線緩存閱讀

Android 清除WebView緩存