• 【Android】webview javascript 注入方法


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

    但是当需要注入一整个js文件的时候,貌似就有点麻烦了。
    不过理清以下思路,方法其实也很简单,如下:
    我们通过在webview的onPageFinished方法中执行js代码注入:

    第一种:
    当webview加载完之后,读取整个js文件中的内容,然后将整个文件内容以字符串的形式,通过webview.loadUrl("javascript:fileContentString")注入

    URL url = new URL("http://www.rayray.ray/ray.js");
    in = url.openStream();
    byte buff[] = new byte[1024];
    ByteArrayOutputStream fromFile = new ByteArrayOutputStream();
    FileOutputStream out = null;
    do {
           int numread = in.read(buff);
           if (numread <= 0) {
             break;
             }
            fromFile.write(buff, 0, numread);
         } while (true);
    String wholeJS = fromFile.toString();
    @Override
    public void onPageFinished(WebView view, String url) 
     {
            super.onPageFinished(view, url);
             webview.loadUrl("javascript:" + wholeJS);
     }

    第二种:
    页面加载完之后,直接向webview对应的html中加入<script>便签,并包含要注入的js的Url地址,如下:

    String js = "var newscript = document.createElement("script");";
    js += "newscript.src="http://www.123.456/789.js";";
    js += "document.body.appendChild(newscript);";
    @Override
     public void onPageFinished(WebView view, String url) 
      {
           super.onPageFinished(view, url);
            webview.loadUrl("javascript:" + js);
      }

    后记:上面两种方式中,第二种方法更加简单方便一点。不过第二种方法也有问题,当你注入完JS之后你想要立即调用其中的方法,第一种方法没问题可以调用到。但是第二种方法中,你要确保注入的<script>便签对应的js文件加载完才可调用成功。

    解决:在第二种方法中为加入script标签添加onload事件,确保该script已加载完成。代码可更改如下:

    String js = "var newscript = document.createElement("script");";
       js += "newscript.src="http://www.123.456/789.js";";
       js += "newscript.onload=function(){xxx();};";  //xxx()代表js中某方法
       js += "document.body.appendChild(newscript);";


    IOS中也一样,按照同样的思路然后在-(void)webViewDidFinishLoad:(UIWebView *)webView 中使用[webView stringByEvaluatingJavaScriptFromString:@"xxx"];即可 。

  • 相关阅读:
    asp.net
    Angualr ng-bind-html样式不加载解决办法
    angualr 单页面跳转(仿weui切换动画)
    很多人再找的6位框输入密码 类似于支付时候的输入密码框
    angual+mui 双栏上拉加载,微信里面禁用默认事件可用,可以防止浏览器回弹效果
    单页面跳转添加返回和跳转动画(仿app) 只对单页面和跳转有用,我用的是angualr,有不会的可以私信问我。
    文字前后对齐
    angual+ mui 导航切换实现上拉加载
    ajax监听上传进度
    Echais 点击legend
  • 原文地址:https://www.cnblogs.com/rayray/p/3680500.html
Copyright © 2020-2023  润新知