WebView与JS的交互

96
tmyzh
2018.01.03 23:21* 字数 340

上一篇介绍了WebView的基础用法,可以移步下面的链接

WebView的基础用法

下面进入今天的正题 WebView与JS的交互

1.Android调用JS里面的方法

html文件如下

callJS里面有2句代码  1调用alter()方法  2  return值

这里对应了2中调用JS代码的方式

1.alter方法会触发 webChromeClient里面的 onJsAlter方法


// 设置允许JS弹窗webSettings.setJavaScriptCanOpenWindowsAutomatically(true);

设置这句否则不能显示弹窗

2 通过WebView的evaluateJavascript() 可以获取方法中的返回值

对比一下两个方式


2 JS调用Android代码

先奉上html代码和Android代码

html代码
android代码

通过WebViewaddJavascriptInterface()进行对象映射

这里要注意做这个功能的时候要将js调用的方法名和对象名都清楚告诉web端  test.hello(String name),前面的对象名不能掉.

规定对被调用的函数以@JavascriptInterface进行注解从而避免漏洞攻击,这里对漏洞不做多的解释。

通过WebViewClient的方法shouldOverrideUrlLoading ()回调拦截 url

这种方式用的比较少,可以在android中捕获一些html上的数据,下面给出代码供参考


目前自己手上的项目大量用到webview的一些功能,下篇会总结一些webview使用上的小技巧,帮大家避坑。



随笔
Web note ad 1