教育行业A股IPO第一股(股票代码 003032)

全国咨询/投诉热线:400-618-4000

Android培训实战教程之WebView案例分析

更新时间:2015年12月28日14时25分 来源:传智播客Android培训学院 浏览次数:

WebView案例分析
WebView(网络视图)能加载显示网页,可以将其视为一个浏览器。它使用了WebKit渲染引擎加载显示网页。
        mWebView = new WebView(this);
        setContentView(mWebView);
需要在AndroidManifest.xml文件中添加权限,否则会出现Web page not available错误。
  <uses-permission android:name="android.permission.INTERNET" />
调用WebView的loadUrl()方法,设置WevView要显示的网页:
  互联网用:webView.loadUrl("http://www.baidu.com"); 
  本地文件用:webView.loadUrl("file:///android_asset/index.html"); 本地文件存放在:assets文件中

1.1. 在WebView中如何让JS与Java安全地互相调用

可参考文章http://www.pedant.cn/2014/07/04/webview-js-java-interface-research/

1.2. JS与Java的互调

1.2.1. Java调用JS

案例1以加载视频聚合类网站为例 类似优酷/乐视网/凤凰网
其中以优酷网为特殊:在android 4.4 平台webview 的 chorme内核无法解析<a href=”http://xxx” target=”video”> 视频链接</a> 像这个标签 中 target=”video”就是当前版本无法解析的问题,我们应该怎么去解决这个问题呢?来分析一下,我们之前遇到的超链接都是target=”_blank” 或者”_self” 那么我们是不是应该考虑将target 更改为_self 呢。来尝试一下
var ahrefs = document.getElementsByTagName('a');
if( ahrefs != undefined ) {
for(i = 0 ; i<ahrefs.length;i++ ){
 if( ahrefs[i].target == 'video'){
 ahrefs[i].target = '_self';}
}
}
 
这是我们的js代码,那只需要我们调用一下这段js代码就可以将target=”video”更改为target=”_self”.WebView的 loadUrl 就可以直接调用js代码只要在js代码的字符串前添加javascript:  就可以了。这样就帮助了chorme 内核将我们知道他们无法解析的属性给提前解析了。
案例2去除youku 搜库button提交form表单拦截事件 onsubmit
   mWebView.loadUrl("javascript: var fromSearch = document.getElementById('mheader_search3');"
                        + "if( fromSearch != undefined ) { fromSearch.target='_self' ; fromSearch.onsubmit = '';  }");

1.2.2. JS调用Java

案例1类似移动端手机迅雷在当前网页查找可用视频地址,查到以后提示用户使用体验更佳的播放器进行播放
  settings.setJavaScriptEnabled(true);
  mWebView.addJavascriptInterface(new JavaInterface(), "java");
JavaInterface 为js 调用java代码的接口
 public class JavaInterface{
  public void showVideoTips(String videoUrl){
    //这里我们弹出一个dialog 提示用户
}
public void isADUrl(String videoUrl){
 //记录当前时候是广告地址
}}
 
接下来我们就应该考虑怎么去查找当前网页的有效播放地址
   mWebView.loadUrl("javascript:
var vs = document.getElementsByTagName('video');"
 + "if(vs == undefined) {return;}
var v = vs[0];
if(v != undefined){
var vurl = v.src;                    
window.java.showVideoTips(vurl);         
}else{
window.java.showVideoTips(''); }                                                  ");
                   
 
 
案例2这个获取视频其实是不太规范的,一般的视频网站都会在正片前有广告对不对,那广告你还告诉用户说来体验体验我们的播放器吧,用户一看,我靠让我体验广告来了,说不定分分钟卸载了。那我们来看看怎么去过滤广告
String js = "javascript: var v=document.getElementsByTagName('video')[0]; if(v!=undefined){   
 var vurl = v.src; 
 if(v.duration == 1|| v.duration > " + webSiteAD.len+ "){     window.LetvFish.getPlayUrl(vurl);
 }else{ 
Window.java.isADUrl(vurl); 
 } 
}else{ 
window.java.showVideoTips('');  }                                                                          ";
 mWebView.loadUrl(js);
 
 
总体步骤就变成在获取视频的时候看一下这个视频的长度,如果视频长度过短,就说明这个视频可能就是一个广告,那像这样的话,我们就需要重新去获取视频

1.3. WebView中userAgent的妙用

1.3.1. 模拟桌面版浏览器

mWebView.setUserAgent(“Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36”);
设置过后userAgent再次访问效果就变成了桌面版页面了

1.3.2. 取消WebView与默认APP之间的跳转

 凤凰网修改 useragent 中 Linux 字符 防止凤凰网判断 useragent 后视图启动自己app 造成跳转失败。因为并不是所有的网页都会跳转到自己的APP,所以我们要记录一下默认的userAgent,然后在不需要更改userAgent的时候还原
 //更改凤凰网userAgent防止到app的跳转
 WebSettings setting = mWebView.getSettings();
 String user_agent = setting.getUserAgentString();
 setting.setUserAgentString(user_agent.replace("Linux", ""));
 
 
// 保存 useragent 凤凰网访问需要特殊处理 useragent 非凤凰网还原useragent
 if (defaultUserAgent == null) {
      defaultUserAgent = mWebView.getSettings().getUserAgentString();
  }
 
//在不需要更改useragent的时候还原
 if (defaultUserAgent != null) {                            WebView.getSettings().setUserAgentString(defaultUserAgent);
 }
 
 
本文版权归传智播客Android培训学院所有,欢迎转载,转载请注明作者出处。谢谢!
作者:传智播客Android培训学院
首发:http://www.itcast.cn/android/
0 分享到:
和我们在线交谈!