Android WebView使用

最近工作中，基本一直在用WebView,今天就把它整理下：

1、WebView简介

WebView组件是Android提供用于显示网页信息，它内置了WebKit引擎，WebKit是一个开源的浏览器引擎，Chrome浏览器也是基于它，所以我们可以把WebView当做一个轻量级的浏览器使用。

在使用WebView前，先需要添加权限：

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

private WebView webview;
webview = (WebView) findViewById(R.id.webview);  

2、使用WebView加载网页

        //加载网页
        webView.loadUrl("http://www.baidu.com");
        //加载本地网页，这里的格式是固定的，文件位置assets目录下
        webView.loadUrl(file:///android_asset/XXX.html);

        //使用loadData方法来加载html数据
        //loadData需要三个参数：HTML TAG，MIME类型（text/html)，网页编码方式（utf-8）
        webView.loadData(content,"text/html","UTF-8");

WebView状态

//激活WebView为活跃状态，能正常执行网页的响应
webView.onResume() ；

//当页面被失去焦点被切换到后台不可见状态，需要执行onPause
//通过onPause动作通知内核暂停所有的动作，比如DOM的解析、plugin的执行、JavaScript执行。
webView.onPause()；

//当应用程序(存在webview)被切换到后台时，这个方法不仅仅针对当前的webview而是全局的全应用程序的webview
//它会暂停所有webview的layout，parsing，javascripttimer。降低CPU功耗。
webView.pauseTimers()
//恢复pauseTimers状态
webView.resumeTimers()；

//销毁Webview
//在关闭了Activity时，如果Webview的音乐或视频，还在播放。就必须销毁Webview
//但是注意：webview调用destory时,webview仍绑定在Activity上
//这是由于自定义webview构建时传入了该Activity的context对象
//因此需要先从父容器中移除webview,然后再销毁webview:
rootLayout.removeView(webView); 
webView.destroy();

1.直接打开浏览器使用

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

2.打开网页时不调用系统浏览器，而是在本WebView中显示

mWebView.setWebViewClient(new WebViewClient(){
      @Override
      public boolean shouldOverrideUrlLoading(WebView view, String url) {
          view.loadUrl(url);
          return true;
      }
  });

myWebView.setWebViewClient(new WebViewClient() {

        @Override
        public void onPageStarted(WebView view, String url, Bitmap favicon) {

        //想在页面开始加载时有操作，在这添加
        super.onPageStarted(view, url, favicon);
        }

        @Override
        public void onPageFinished(WebView view, String url) {

            //想在页面加载结束时有操作，在这添加
            super.onPageFinished(view, url);
        }

        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
        //返回值是true的时候WebView打开，为false则系统浏览器或第三方浏览器打开。如果要下载页面中的游戏或者继续点击网页中的链接进入下一个网页的话，重写此方法下，不然就会跳到手机自带的浏览器了，而不继续在你这个webview里面展现了 
        return true;
        }
        @Override  

        public void onReceivedError(WebView view, int errorCode,  

        String description, String failingUrl) {  

        //想在收到错误信息的时候，执行一些操作，走此方法  

        }  
    });

3.返回键，返回上一次浏览的界面（不是退出程序）

还有一点很重要，要想进入通过webview浏览网页，而且点返回键是想在webview中返回，而不是直接退出程序，那么就得重写onKeyDown方法。

    @Override  

    public boolean onKeyDown(int keyCode, KeyEvent event) {  


         if (keyCode == KeyEvent.KEYCODE_BACK && webView.canFoBack()) {  // goBack()表示返回WebView的上一页面  

             webView.goBack();  

             //退出全屏  

             quitFullScreen();  

             return true;  

         } else {  

             //结束当前页
             return super.onKeyDown(keyCode, event);
         }  

     }    

4.页面缩放

设置自适应手机屏幕，两者合用

webView.getSettings().setUseWideViewPort(true);//将图片调整到适合webView的大小
webView.getSettings().setLoadWithOverviewMode(true);//缩放至屏幕大小

缩放操作

webSettings.setSupportZoom(true); //支持缩放，默认为true。是下面那个的前提。
webSettings.setBuiltInZoomControls(true); //设置内置的缩放控件。若为false，则该WebView不可缩放
webSettings.setDisplayZoomControls(false); //隐藏原生的缩放控件

比例缩放

webView.setInitialScale(50);

webView = (WebView) findViewById(R.id.webView_notification);
//  WebSettings webSettings = webView.getSettings();
webView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);//设置js可以直接打开窗口，如window.open()，默认为false
webView.getSettings().setJavaScriptEnabled(true);//是否允许执行js，默认为false。设置true时，会提醒可能造成XSS漏洞
webView.getSettings().setSupportZoom(true);//是否可以缩放，默认true
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setDefaultZoom(WebSettings.ZoomDensity.CLOSE);
webView.getSettings().setUseWideViewPort(true);//设置此属性，可任意比例缩放。大视图模式
webView.getSettings().setLoadWithOverviewMode(true);//和setUseWideViewPort(true)一起解决网页自适应问题
webView.getSettings().setAppCacheEnabled(true);//是否使用缓存
webView.getSettings().setDomStorageEnabled(true);//DOM Storage
webView.getSettings().setUserAgentString("User-Agent:MicroMessenger");//设置用户代理
webView.setWebChromeClient(mChromeClient);
webView.setWebViewClient(mWebViewClient);

WebSettings webSettings = mWebView .getSettings();

//支持获取手势焦点，输入用户名、密码或其他
webview.requestFocusFromTouch();

webSettings.setJavaScriptEnabled(true);  //支持js
webSettings.setPluginsEnabled(true);  //支持插件

webSettings.setRenderPriority(RenderPriority.HIGH);  //提高渲染的优先级

设置自适应屏幕，两者合用
setUseWideViewPort(true);  //将图片调整到适合webview的大小
setLoadWithOverviewMode(true); // 缩放至屏幕的大小

setSupportZoom(true);  //支持缩放，默认为true。是下面那个的前提。
setBuiltInZoomControls(true); //设置内置的缩放控件。
//若上面是false，则该WebView不可缩放，这个不管设置什么都不能缩放。
setTextZoom(2);//设置文本的缩放倍数，默认为 100

setDisplayZoomControls(false); //隐藏原生的缩放控件

setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN); //支持内容重新布局
supportMultipleWindows();  //多窗口
setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);  //关闭webview中缓存
setAllowFileAccess(true);  //设置可以访问文件
setNeedInitialFocus(true); //当webview调用requestFocus时为webview设置节点
setJavaScriptCanOpenWindowsAutomatically(true); //支持通过JS打开新窗口
setLoadsImagesAutomatically(true);  //支持自动加载图片
setDefaultTextEncodingName("utf-8");//设置编码格式

setStandardFontFamily("");//设置 WebView 的字体，默认字体为 "sans-serif"
setDefaultFontSize(20);//设置 WebView 字体的大小，默认大小为 16
setMinimumFontSize(12);//设置 WebView 支持的最小字体大小，默认为 8

关于缓存

缓存模式：

LOAD_CACHE_ONLY: 不使用网络，只读取本地缓存数据
LOAD_DEFAULT: （默认）根据cache-control决定是否从网络上取数据。
LOAD_NO_CACHE: 不使用缓存，只从网络获取数据.
LOAD_CACHE_ELSE_NETWORK，只要本地有，无论是否过期，或者no-cache，都使用缓存中的数据。

if (NetStatusUtil.isConnected(getApplicationContext())) {
    webSettings.setCacheMode(WebSettings.LOAD_DEFAULT);//根据cache-control决定是否从网络上取数据。
} else {
    webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);//没网，则从本地获取，即离线加载
}

webSettings.setDomStorageEnabled(true); // 开启 DOM storage API 功能
webSettings.setDatabaseEnabled(true);   //开启 database storage API 功能
webSettings.setAppCacheEnabled(true);//开启 Application Caches 功能

String cacheDirPath = getFilesDir().getAbsolutePath() + APP_CACAHE_DIRNAME;
webSettings.setAppCachePath(cacheDirPath); //设置  Application Caches 缓存目录

注意： 每个 Application 只调用一次 WebSettings.setAppCachePath()，WebSettings.setAppCacheMaxSize()

Android5.0 WebView中Http和Https混合问题

在Android 5.0上 Webview 默认不允许加载 Http 与 Https 混合内容：

解决办法：

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
     webView.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
}

参数类型说明：
MIXED_CONTENT_ALWAYS_ALLOW：允许从任何来源加载内容，即使起源是不安全的；
MIXED_CONTENT_NEVER_ALLOW：不允许Https加载Http的内容，即不允许从安全的起源去加载一个不安全的资源；
MIXED_CONTENT_COMPATIBILITY_MODE：当涉及到混合式内容时，WebView 会尝试去兼容最新Web浏览器的风格。

在5.0以下 Android 默认是 全允许，
但是到了5.0以上，就是不允许，实际情况下很我们很难确定所有的网页都是https的，所以就需要这一步的操作。

示例：显示“www.baidu.com”、获取其标题、提示加载开始和结束和获取加载进度。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"

    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.carson_ho.webview_demo.MainActivity">


   <!-- 获取网站的标题-->
    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""/>

    <!--开始加载提示-->
    <TextView
        android:id="@+id/text_beginLoading"
        android:layout_below="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""/>

    <!--获取加载进度-->
    <TextView
        android:layout_below="@+id/text_beginLoading"
        android:id="@+id/text_Loading"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""/>

    <!--结束加载提示-->
    <TextView
        android:layout_below="@+id/text_Loading"
        android:id="@+id/text_endLoading"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""/>

    <!--显示网页区域-->
    <WebView
        android:id="@+id/webView1"
        android:layout_below="@+id/text_endLoading"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_marginTop="10dp" />
</RelativeLayout>

public class MainActivity extends AppCompatActivity {
    WebView mWebview;
    WebSettings mWebSettings;
    TextView beginLoading,endLoading,loading,mtitle;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        mWebview = (WebView) findViewById(R.id.webView1);
        beginLoading = (TextView) findViewById(R.id.text_beginLoading);
        endLoading = (TextView) findViewById(R.id.text_endLoading);
        loading = (TextView) findViewById(R.id.text_Loading);
        mtitle = (TextView) findViewById(R.id.title);

        mWebSettings = mWebview.getSettings();

        mWebview.loadUrl("http://www.baidu.com/");


        //设置不用系统浏览器打开,直接显示在当前Webview
        mWebview.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return true;
            }
        });

        //设置WebChromeClient类
        mWebview.setWebChromeClient(new WebChromeClient() {


            //获取网站标题
            @Override
            public void onReceivedTitle(WebView view, String title) {
                System.out.println("标题在这里");
                mtitle.setText(title);
            }


            //获取加载进度
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                if (newProgress < 100) {
                    String progress = newProgress + "%";
                    loading.setText(progress);
                } else if (newProgress == 100) {
                    String progress = newProgress + "%";
                    loading.setText(progress);
                }
            }
        });


        //设置WebViewClient类
        mWebview.setWebViewClient(new WebViewClient() {
            //设置加载前的函数
            @Override
            public void onPageStarted(WebView view, String url, Bitmap favicon) {
                System.out.println("开始加载了");
                beginLoading.setText("开始加载了");

            }

            //设置结束加载函数
            @Override
            public void onPageFinished(WebView view, String url) {
                endLoading.setText("结束加载了");

            }
        });
    }

    //点击返回上一页面而不是退出浏览器
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK && mWebview.canGoBack()) {
            mWebview.goBack();
            return true;
        }

        return super.onKeyDown(keyCode, event);
    }

    //销毁Webview
    @Override
    protected void onDestroy() {
        if (mWebview != null) {
            mWebview.loadDataWithBaseURL(null, "", "text/html", "utf-8", null);
            mWebview.clearHistory();

            ((ViewGroup) mWebview.getParent()).removeView(mWebview);
            mWebview.destroy();
            mWebview = null;
        }
        super.onDestroy();
    }
}

参考：

http://www.jianshu.com/p/3fcf8ba18d7f?utm_source=desktop&utm_medium=timeline

http://blog.csdn.net/carson_ho/article/details/52693322