android中WebView注入Js的问题记录

在使用WebView加载https链接，会有证书验证问题，通过复写WebViewClient中的方法可以解决，代码如下：

mWebView.setWebViewClient(new WebViewClient() {
            @Override
            public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
                handler.proceed();
            }
        });

打开与web页面中的js交互必须要设置：

mWebView.getSettings().setJavaScriptEnabled(true);

项目中通过对一个第三方的web页面进行js代码注入，实现获取web页面输入值的获取。具体实现步骤如下：

第一步在工程中定义一个和web js交互的接口类（注意并不是java上的interface），gihub上个有个开源库JsBridge。

//用于js注入后，html的值回传回来，该类的方法都是在html中进行调用的
    class JavaScriptInterface {

        @JavascriptInterface
        public void getRealname(String realname) {
            Log.d(TAGmsg, "realname==" + realname);
        }

        @JavascriptInterface
        public void getFirstName(String firstName) {
            Log.d(TAGmsg, "firstName==" + firstName);
        }

        @JavascriptInterface
        public void getLastName(String lastName) {
            Log.d(TAGmsg, "lastName==" + lastName);
        }

        @JavascriptInterface
        public void getIndentificationId(String indentificationId) {
            Log.d(TAGmsg, "indentificationId==" + indentificationId);
        }

        @JavascriptInterface
        public void gettel(String tel) {
            Log.d(TAGmsg, "tel==" + tel);
        }

    }

android中调用web端js的方法：

mWeb_view.loadUrl("javascript:" + "js中的具体方法名");

第二步将与js交互的接口类添加到webview实例对象中：

mWeb_view.addJavascriptInterface(new JavaScriptInterface(), "jsTag");

其中jsTag是给js中的一个标记，js 代码中通过该标记进行调用android中的方法。

window.jsTag.getRealname(realname);//getRealname(realname)是android中接口类的方法

以上是简单的交互步骤总结，自带的webview还有相关的WebViewClient、WebChromeClient以及WebView的settings设置的方法。

WebChromeClient ：

辅助WebView处理Javascript的对话框，网站图标，网站title，加载进度等

过程中遇到调用原生 WebView 无法加载网络链接，怀疑是手机无法联网导致，具体原因不详。

注入 js代码到 Web html页面中遇到的问题：

1、代码注入未成功（怀疑注入的js代码段有问题）

2、js代码段是写在 assets 中的txt文档中，通过读取txt文档传递内容，调试发现有换行和空格占位符，怀疑是换行符和空格符的影响

最终发现是 js 代码段有问题，在txt文件中，不写 <script></ script>,则成功注入

var child = document.getElementById("next");
child.onclick=function(){
    getInputdata();
    alert("onclick");
};
function getInputdata(){
	var realname = document.getElementById("realname").value;
	var firstName = document.getElementById("firstName").value;
	var lastName = document.getElementById("lastName").value;
	var indentificationId = document.getElementById("indentificationId").value;
	var tel = document.getElementById("tel").value;

	window.getDatas.getRealname(realname);
	window.getDatas.getFirstName(firstName);
	window.getDatas.getLastName(lastName);
	window.getDatas.getIndentificationId(indentificationId);
	window.getDatas.gettel(tel);
	alert("getInputdata");

};

此方法获取web 中html的数据，需要知道html中的对应的标签的 id或者name。

这是遇到坑的一个总结，网上查了很多资料当时并没有很好的解答，因此记录总结一下。

android中WebView注入Js的问题记录

猜你喜欢