Android调用webview，注入JS入门

适合从来没有过webview开发经验的小白。

public class WebViewUtil {
    private static final String JS_SRC_RULE = "var obj = document.createElement(\"script\");"
            + "obj.type=\"text/javascript\";"
            + "obj.src=\"%s\";"
            + "document.body.appendChild(obj);";

    @SuppressWarnings("deprecation")
    public static WebView initWebView(final WebView webview)
    {
        webview.setHorizontalScrollBarEnabled(false);
        webview.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
        webview.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                switch (event.getAction()) {
                    case MotionEvent.ACTION_DOWN:
                    case MotionEvent.ACTION_UP:
                        if (!v.hasFocus()) {
                            v.requestFocus();
                        }
                        break;
                }
                return false;
            }
        });

        WebSettings setting = webview.getSettings();
        setting.setJavaScriptEnabled(true);
        setting.setUseWideViewPort(true);
        setting.setSupportZoom(true);
        setting.setBuiltInZoomControls(true);
        setting.setDisplayZoomControls(false);
        setting.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
        setting.setLoadWithOverviewMode(true);

        setting.setCacheMode(WebSettings.LOAD_DEFAULT);
        setting.setDatabaseEnabled(false);
        setting.setAppCacheEnabled(false);
        setting.setDomStorageEnabled(false);
        setting.setGeolocationEnabled(true);
        //安全性相关,默认先屏蔽
        setting.setSaveFormData(false);
        setting.setDomStorageEnabled(false);
        setting.setAllowFileAccess(false);
        setting.setSavePassword(false);

        //解决5.0以上设置cookie失败的问题
        CookieManager cookieManager = CookieManager.getInstance();
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            cookieManager.setAcceptThirdPartyCookies(webview, true);
        }
        // 用于网页JS端的调试
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            webview.setWebContentsDebuggingEnabled(true);
        }

        //16以上默认是关闭的，不用设
//        if (Build.VERSION.SDK_INT >= 16)
//        {
//            setting.setAllowFileAccessFromFileURLs(false);
//            setting.setAllowUniversalAccessFromFileURLs(false);
//        }

//        setting.setDefaultTextEncodingName("utf-8");
//        setting.setJavaScriptCanOpenWindowsAutomatically(true);

        if (Build.VERSION.SDK_INT <= 13) {
            setting.setTextSize(WebSettings.TextSize.NORMAL);
        } else {
            setting.setTextZoom(100);
        }
        if (Build.VERSION.SDK_INT <= 9)
        {
            webview.setInitialScale(150);
        }
        if(Build.VERSION.SDK_INT >= 21) {
            setting.setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
        }

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            webview.setWebContentsDebuggingEnabled(true);
        }

        webview.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);// 使用当前WebView处理跳转
                return false;
            }

            @Override
            public void onPageFinished(final WebView view, String url) {
                super.onPageFinished(view, url);
                // 这里你可以注入自己js代码，拿JS_SRC_RULE创建一个节点，百度一大把注入节点方法和格式
                view.loadUrl("javascript:" + "XXX.getMethods()");
            }
        });

        webview.setOnKeyListener(new View.OnKeyListener() {
            @Override
            public boolean onKey(View v, int keyCode, KeyEvent event) {
                if (event.getAction() == KeyEvent.ACTION_DOWN) {
                    if (keyCode == KeyEvent.KEYCODE_BACK && webview.canGoBack()) {
                        webview.goBack();
                        return true;
                    }
                }
                return false;
            }
        });

        class JsObject {
            // 断言引用声明，很重要
            @JavascriptInterface
            public String toString() { return "injectedObject"; }
        }

        // 创建网页回调，injectedObject表示叫全局js对象，你可以理解自己定义的全局变量
        webview.addJavascriptInterface(new JsObject(), "injectedObject");
        return webview;
    }
}

利用Chrome来显示自己页面： chrome://inspect/#devices

大致你能看到这个，如果你的设备启动了开发者debug
然后启动开发者模式到这个页面：

接着找到这个：

这里你可能是个白板界面，应该这个远程调试要翻墙，当然有本地方法解决的：
chrome远程调试按inspect后出现的界面为空白，应如何解决?

编辑hosts文件，添加：
61.91.161.217    chrome-devtools-frontend.appspot.com
61.91.161.217    chrometophone.appspot.com
即可

你会看到这样的界面，这个就是远程调试的界面了，和你设备访问是实时刷新的：

左下角是格式化

JS代码和界面我就不贴了，怕被法律锅。。。

关于调试技巧：

chrome 控制台js调试与断点调试
本人使用只是js接口简单，直接在js方法上打断点就行了。

关于注入形式：

iOS Android 注入js
总之：Android中向webview注入js代码可以通过webview.loadUrl("javascript:xxx")来实现，然后就会执行javascript后面的代码。

关于这个Chrome功能介绍：

远程调试 Android 设备使用入门需要翻墙...