WebView的使用总结

一、配置WebView

setWebViewClient：对webview页面加载管理、如url重定向
setWebChromeClient：主要是对js交互的处理。比如说：对话框、title、页面加载进度条等等。

二、WebView与H5页面的交互方式

很多情况下，js的交互都可以直接扔到WebView上自动处理。但有一些特殊情况，比如说：点击h5页面的按钮跳转去android原生页面，或者h5页面中选择手机中图片作为用户头像等等。遇到这些问题，其实方案还是蛮多的。

方案一：

使用浏览器的开发者工具查看点击时的产生的url或js处理，然后通过我们的shouldOverrideUrlLoading回调函数进行处理。或者可以找前端同学约定好url格式为[scheme_name]:[params]，举个栗子吧：
前端代码：document.location = "js://demo?arg1=111"; 或者跳转，这时候我们就可以在shouldOverrideUrlLoading(webView, url)对url"js://demo?arg1=111"进行判断处理了。

// 示例代码：
@Override
public boolean shouldOverrideUrlLoading(WebView webView, String url) {
    if(mInnerRedirect && StringUtil.isHttpUrl(url)){
        webView.loadUrl(url);
        return true;
    }
    // 处理前端定义好的JS协议（url）
    boolean isIntercepted = ProtocolManager.getInstance().processProtocol(mActivity,mWebView,url);
    return isIntercepted;
}

//上面ProtocolManager中的processProtocol方法
public boolean processProtocol(Context context, WebView webView, String url) {
    if(context == null || TextUtils.isEmpty(url)) {
        return false;
    }

    String pureUrl;
    Map paramMap = null;
    int paramIndex = url.indexOf('?');
    if(paramIndex != -1){
        pureUrl = url.substring(0,paramIndex);
        paramMap = StringUtil.extractParams(url);
    } else {
        pureUrl = url;
    }

    if(pureUrl.endsWith("/")) {
        pureUrl = pureUrl.substring(0,pureUrl.length() - 1);
    }

    if(paramMap == null) {
        paramMap = new HashMap<>(0);
    }
    for(IProtocolProcessor processor : mProcessorList) {
        if(processor.process(context,webView,url,pureUrl,paramMap)) {
            return true;
        }
    }
    return false;
}

方案二：

使用谷歌推荐的webview.addJavascriptInterface(JavascriptInterface, obj_name)，自定义一个JavascriptInterface以及相应的js代码。
比如点击webview中图片，然后本地显示大图的代码：

public class JavascriptInterface {

    @android.webkit.JavascriptInterface
    public void startPhotoActivity(String imageUrl) {
        Log.e("webView", "JavascriptInterface : " + imageUrl);
        Intent intent = new Intent(MainActivity.this, PhotoActivity.class);
        intent.putExtra("image_url", imageUrl);
        startActivity(intent);
    }
}

wvTest.addJavascriptInterface(new JavascriptInterface(),"mainActivity");

// JS代码
function()  {  
    // 获取"img"标签的对象的集合  
    var imgs = document.getElementsByTagName("img");  
    for(var i = 0; i < imgs.length; i++)  {  
        // 添加点击事件  
        imgs[i].onclick = function()  {  
        // "mainActivity"是在上面Java代码中创建的  
            mainActivity.startPhotoActivity(this.src);  
        }  
    }  
}

方案三：

WebChromeClient提供了不少高级交互的回调函数，如：onShowFileChooser、onJsAlert、onProgressChanged等等。百度首页的搜索栏上有个图片上传搜索功能，当被点击时就会触发onShowFileChooser函数

//todo 加载进度条

//todo 下载

//todo 浏览位置

//todo 错误处理

//todo 字体

//todo 性能优化