Android WebView与js交互的问题记录

原创 2016年08月28日 19:18:06

记录下昨天项目开发中遇到的关于webView与js交互出现的那点不愉快的小小事

1.细节问题

  • 1.贴上Html代码

    /**index.html*/
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        </head>
        <body>
            <!--Js调用Android代码-->
            <a onClick="window.index.onCallback"></a>   
        </body>
    </html>
    
  • 2.有木有感觉这几句代码中有一个很大的坑

    <a onClick="window.index.onCallback"></a>   
    
    • 就是这一句,刚开始就一直郁闷怎么js调用android代码,为何一直没有任何反应?targetSdkVersion版本的问题以及该注意的细节也都有兼顾到了,终究调用不起来,后来找了朋友帮忙看下,才发觉少了 “()”导致的问题,我也是醉了。要多学习咯

2.js回调的问题

  • 1.由于最近开发的项目主页面组成是FragmentTabHost + ViewPage + Fragment,而其中的fragment中嵌入H5的界面,需求是点击H5界面的一个图标,可以跳转到主页面另一Tab对应的Fragment。

  • 2.解决了上面关于js回调相应的问题,又出现了一问题,贴Android代码

    webView.addJavascriptInterface(new onJSCallAndroid(){
            @JavascriptInterface
            @Override
            public void onCallWorkcircle() {
    
                ((MainActivity)mActivity).mTabHost.setCurrentTab(1);
            }
    
  • 3.现象:点击H5界面的图标,没有跳转到Tab1界面,通过打印log是可以确定此处的代码是执行的,接着点击Tab1,Tab1对应的Fragment出现了白屏,查看异常日志,没有异常信息。接连点击底部的Tab,页面不断切换,Tab1对应的Fragment依然白屏,最后崩溃退出,查看了日志是说空指针异常,明显这不是导致切换不响应和白屏的因素;

  • 4.在调试的过程中,发现了日志中有如下的提醒信息(并非error级别),真是惊醒梦中人

    android.view.ViewRootImpl$CalledFromWrongThreadException: 
    Only the original thread that created a view hierarchy can touch its views.
    08-27 18:44:02.412 3346-3557/com.hy.binbin W/System.err:     at android.view.ViewRootImpl.checkThread(ViewRootImpl.java:6795)
    08-27 18:44:02.412 3346-3557/com.hy.binbin W/System.err:     at android.view.ViewRootImpl.requestLayout(ViewRootImpl.java:938)
    08-27 18:44:02.412 3346-3557/com.hy.binbin W/System.err:     at android.view.View.requestLayout(View.java:18864)
    08-27 18:44:02.412 3346-3557/com.hy.binbin W/System.err:     at android.view.View.requestLayout(View.java:18864)
    08-27 18:44:02.412 3346-3557/com.hy.binbin W/System.err:     a
    
    ...
    
  • 5.原来js的回调不是执行在UI线程,那么不是执行在UI线程,如何进行界面的改变。

    webView.addJavascriptInterface(new onJSCallAndroid(){
        @JavascriptInterface
        @Override
        public void onCallWorkcircle() {
            GlobalUtils.getHandler().post(new Runnable() {
                @Override
                public void run() {
                    ((MainActivity)mActivity).mTabHost.setCurrentTab(1);
                }
            });
        }
    
  • 6.让js回调的代码到UI线程去执行,问题成功解决!下班了…

3.Uncaught ReferenceError异常

  • 1.异常提示信息,非Error

    "Uncaught ReferenceError: browser is not defined", 
    source: http://www.baibai.cn/hongx/sd (144)
  • 2.解决 : 这信息就告诉你,浏览器没有定义方法 , 这么说, 就可以去跟后台聊一聊,是不是忘了配置Js.

4.安全限制问题

在下面将提到的 “在js调用方法上面加注解@JavascriptInterface”的问题,如果不加的话,logcat会出现如下提示,网页无法访问到你的方法

“Uncaught TypeError: window.homepage.onCallCompleteUrl is not a function”

5.other

  • 1.targetSdkVersion版本为17及17以上,在js调用方法上面加注解@JavascriptInterface;这是一个安全限制问题;

    Android文档:
    警告:如果你的程序目标平台是17或者是更高,你必须要在暴露给网页可调用的方法(这个方法必须是公
    开的)加上@JavascriptInterface注释。如果你不这样做的话,在4.2以以后的平台上,网页无法访问到你的方法。 
    
  • 2.webview加载网页的时候,显示不全

    @SuppressLint({ "JavascriptInterface", "SetJavaScriptEnabled" })
    在调用js的地方要通过Lint告知编译器,此处要访问Js方法,且启用js访问
    

5.总结: 注意!!! 细节!!!

版权声明:本文为博主原创文章,未经博主允许不得转载

相关文章推荐

Android 关于webview内容变化,不resize的问题

关于webview内容变化,不resize的问题关于中英文切换,webview长度不变的问题我的是webview被嵌套在scrollview中的,中文内容会比英文的短一些,所以出现了很多空白部分,也就...

安卓学习笔记---解决Android签名混淆后WebView与JS交互失效的问题

今天有一个bug,就是webview跟js交互的方法怎么也调不起来,debug包没问题,release包就出错,想想是打包时混淆的问题,打了一个不混淆的包,果不其然,就是混淆的问题。 然后就找解...

Android JS与WebView交互存在的一些问题

一、背景概述 2013年Android平台暴露出WebView漏洞。利用该漏洞,攻击者可以通过存在风险的addJavascriptInterface接口函数提供的扩展穿透webkit执行本地Ja...

Android 与WebView中的js代码的交互记录

最近公司的项目用到原生和WebView的HTML中代码进行交互,遇到到不少问题,在这里记录一下,以后再用的时候方便。 - 首先说一下WebSettings的配置,它是用来管理WebView配置的类W...

android webview H5开发若干问题之问题三:android和js交互问题

安卓和js的交互,无非就是安卓的java调用js方法,js调用安卓本地java方法。 先来一遍大家都知道的规则。 安卓本地调用js:     js调用安卓方法。在这方面呢,我的理解是安卓本地用java...

Android中WebView与js交互简单Demo

  • 2016年08月16日 12:30
  • 7MB
  • 下载

Android中WebView的JS交互的几种方式

  • 2016年09月28日 10:08
  • 2.57MB
  • 下载

JS与WebView交互存在的一些问题

转自简书,如有侵权,请告知删除。转自http://www.jianshu.com/p/93cea79a2443 著作权归作者所有,转载请联系作者获得授权。 一、背景概述 2013...

Android 通过webview和js的交互

  • 2016年11月04日 13:35
  • 98KB
  • 下载

Android webview和JS交互

  • 2016年02月17日 14:55
  • 7.26MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Android WebView与js交互的问题记录
举报原因:
原因补充:

(最多只允许输入30个字)