前言 动态执行脚本能有效的降低重要功能硬编码带来的问题,尤其是依赖于第三方的应用,可以通过动态脚本+在线参数(例如友盟在线参数)再不更新应用的情况下升级功能。
声明 |
目前分類:WEBVIEW (31)
- Apr 13 Mon 2015 22:19
【Android】不使用WebView来执行Javascript脚本
- Apr 12 Sun 2015 09:46
Android 各版本WebView
转载请注明出处 http://blog.csdn.net/typename/ powered by miechal zhao : miechalzhao@gmail.com
前言:
根据Google公布的Android 各个系统版本市场占有率(Google Android dashboards), Android 4.0及其以上系统将近90%左右,发展趋势必将是未来市面上几乎是Android 4.0以上系统。本文主要关注Android 4.0及以上系统WebView的实现,从Android WebView实现的Framework层大致可以分为三段Android 4.0系列,Android 4.1---4.3系列,Android 4.4及其以上系列。
WebView差异
WebView是Android系统提供能显示网页的系统控件,它是一个特殊的View,同时它也是一个ViewGroup可以有很多其他子View。在Android 4.4以下(不包含4.4)系统WebView底层实现是采用WebKit(http://www.webkit.org/)内核,而在Android 4.4及其以上Google 采用了chromium(http://www.chromium.org/)作为系统WebView的底层内核支持。在这一变化中Android 提供的WebView相关API并没有发生大变化,在4.4上也兼容低版本的API并且引进了少部分API。这里简单介绍下基于Chromium 的Webview和基于Webkit webview的差异,基于Chromium Webview提供更广的HTML5,CSS3,Javascript支持,在目前最新Android 系统版本5.0上基于chromium 37,Webview提供绝大多数的HTML5特性支持。Webkit JavaScript引起采用WebCore Javascript 在Android 4.4上换成了V8能直接提升JavaScript性能。另外Chromium 支持远程调试(Chrome DevTools)。
WebKit for WebView VS Chromium for WebView性能比对(测试环境 小米2. CM Browser. Android 4.1.1 VS 4.4.3)
Webkit for Webview | Chromium for Webview | 备注 | |
HTML5 | 278 | 434 | http://html5test.com/ |
远程调试 | 不支持 | 支持 | Android 4.4及以上支持 |
内存占用 | 小 | 大 | 相差20-30M左右 |
WebAudio | 不支持 | 支持 | Android 5.0及以上支持 |
WebGL | 不支持 | 支持 | Android 5.0及以上支持 |
WebRTC | 不支持 | 支持 | Android 5.0及以上支持 |
Android 4.0 WebView结构
- Apr 12 Sun 2015 02:49
android開發遇到的問題與小結
一、按BACK、HOME键后activity的生命周期问题
按Back键后activity被销毁,HOME则没有被销毁。
activity的生命周期 参看:http://blog.csdn.net/Android_Tutor/article/details/5772285
二、webview捕获js的alert、confirm、prompt事件
使用WebChromeClient主要辅助WebView处理Javascript的对话框、网站图标、网站title、加载进度等
WebViewClient与WebChromeClient的区别 参看:http://www.cnblogs.com/Crazy-jacking/archive/2011/11/24/2262425.html
WebChromeClient的使用 参看:http://618119.com/archives/2010/12/20/199.html
三、处理webview显示网页白边问题
解决方法:使用的webview的setScrollBarStyle方法设置滚动条位置的属性,android:scrollbarStyle 可以是insideOverlay可以是outsideOverlay。
具体示例:
- Apr 12 Sun 2015 02:46
Android WebView常見問題以及解決方案
如有转载,请声明出处: 时之沙: http://blog.csdn.net/t12x3456
Android WebView常见问题解决方案汇总:
就目前而言,如何应对版本的频繁更新呢,又如何灵活多变地展示我们的界面呢,这又涉及到了web app与native app之间孰优孰劣的争论. 于是乎,一种混合型的app诞生了,灵活多变的部分,如淘宝商城首页的活动页面,一集凡客诚品中我们都可以见到web 页面与native页面的混合,既利用了web app的灵活易更新,也借助了native app本身的效率.
当然,就会用到webview这样的一个控件,这里,我把自己使用过程中遇到的一些问题整理下来.
首先上张图对WebView进行一个基本的回顾:
- Apr 12 Sun 2015 02:45
Android4.4 WebView 回退问题
- Apr 12 Sun 2015 02:39
Android WebView的注意事项
Android WebView的注意事项
1、修改权限,添加<uses-permission android:name="android.permission.INTERNET"/>
2、loadUrl方法要写明协议(如http://,file://等),我就是没有写协议,结果webview白屏但没有报错,调试了很久。
3、处理跳转和返回
//跳转 new WebViewClient(){ @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { // TODO Auto-generated method stub view.loadUrl(url);// 使用当前WebView处理跳转 return true;//true表示此事件在此处被处理,不需要再广播 }} //返回 //覆盖Activity类的onKeyDown(int keyCoder,KeyEvent event)方法 public boolean onKeyDown(int keyCode, KeyEvent event) { if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack()) { webView.goBack(); //goBack()表示返回WebView的上一页面 return true; } return false; }
4、webView.getSettings().setJavaScriptEnabled(true);//设置使用够执行JS脚本
有js的不打开这个选项也会出现白屏
- Apr 12 Sun 2015 02:38
[疑难杂症] Android WebView 无法打开天猫页面
欢迎转载,但请务必注明出处!
http://ryanhoo.github.io/blog/2014/09/17/android-webview-setdomstorageenabled
Android WebView 突然无法打开天猫的详情页,一直停留在加载状态。而在此之前,应用里是完全可以正常访问的,通过搜索,找到解决方法,简单设置一行代码
webView.getSettings().setDomStorageEnabled(true)
即可解决问题,但背后的原因又是什么呢?
我们不能只是做解决问题的程序员,还要做好奇的程序员,跟我来一探究竟吧。
定位问题
本着发现问题 -> 分析问题 -> 解决问题的步骤,接下来我们要定位问题的来源。
Chrome Inspcet Device
我首先想到的是,Android 4.4 以后的 WebView 是基于 chromium 内核的,这带来了一个福利是,我们可以在 chrome 中 inspect device,像普通网页一样,进行 debug,精准、快速定位问题来源。正好我手头有 Nexus 5 刷的是 Android L Preview 还有 Mi3 是最新的 MIUI V6,打开 Chrome,Tools
-> Inspect Devices
,就可以看到原生应用里的 WebView 页面了。
点击 inspect
即可进入 Developer Tools,一切尽在掌控,可以清楚看到 console 输出的错误信息。
- Apr 10 Fri 2015 23:51
【转】Android的WebView控件载入网页显示速度慢的究极解决方案
【转载请注明来源自http://hi.baidu.com/goldchocobo/】
Android客户端中混搭HTML页面,会出现虽然HTML内容载入完成,标题也正常显示,但是整个网页需要等到近5秒(甚至更多)时间才会显示出来。研究了很久,搜遍了国外很多网站,也看过PhoneGap的代码,一直无解。
一般人堆WebView的加速,都是建议先用webView.getSettings().setBlockNetworkImage(true); 将图片下载阻塞,然后在浏览器的OnPageFinished事件中设置webView.getSettings().setBlockNetworkImage(false); 通过图片的延迟载入,让网页能更快地显示。
但是,通过实际的日志发现,Android的OnPageFinished事件会在Javascript脚本执行完成之后才会触发。如果在页面中使用JQuery,会在处理完DOM对象,执行完$(document).ready(function() {});事件自会后才会渲染并显示页面。
可以看到在载入完最后一个JS脚本之后,对DOM元素的渲染和处理就花了8秒,然后执行了AJAX方法载入外部页面又花了2、3秒,最后才会触发onPageFinished显示页面。再往后由于程序中设置了setBlockNetworkImage(false),所以开始载入外部图片。(如果不控制这个参数,图片载入会在渲染期间下载。 综上,由于JS脚本的处理,造成了一张页面打开多花了10秒左右时间。而同样的页面在iPhone上却是载入相当的快,显示完页面才会触发脚本的执行。(提示:如果使用JQueryMobile,更会慢得离谱)
要解决这个问题,就是想办法让浏览器延迟加载JS脚本,但是Android的WebView控件没有这样的参数。无法单独阻塞JS脚本,另外有个setBlockNetworkLoads,用了之后也无法实现类似图片的异步载入的功能,页面成了光板,连CSS也阻塞了。
就是这个问题困扰了很久,直到在做HTML照片墙时,由于setBlockNetworkImage在OnPageFinished之后才会释放,导致在JS脚本载入图片过程中无法获取图片的高宽信息,最后巧妙地通过$(document).ready(function() {setTimeout(func,10)});,成功将函数在onPageFinished之后运行。那么延伸来想,是否可以将JS脚本也用同样的方式延迟载入呢?
答案是肯定的,在http://wonko.com/post/painless_javascript_lazy_loading_with_lazyload可以找到JS脚本延迟加载的第三方组件。
我改造了之前速度奇慢的界面,我所使用的核心JS代码如下:
- Apr 08 Wed 2015 10:24
[转载]Android开发 WebView加载从本地加载图片
原文地址:Android开发 WebView加载从本地加载图片作者:追风少年
//此格式为从网上加载图片的格式
把<img src = http://xxx/xxx/xxx/a.jpg/>格式
//此格式为从本地加载图片的格式此目录为SD卡根目录(建议使用Environment.getExternalStorageDirectory()方法获取SD卡根目录)
改成<img src = file:///sdcard/a.jpg/>格式
//获取一个字符串中图片链接地址列表传入一个字符串获取其中全部图片链接地址add到Vector<String>中返回
private Vector<String> parseImageURL(String text) {
text = text.replaceAll("< *(?i)img ", "n<img ");
String[] list = text.split("n");
- Apr 08 Wed 2015 00:30
認識 UIWebView
- //設定網址字串
- NSString *urlAddress = @"http://ithelp.ithome.com.tw/question/10056941";
- //建立一個NSURL物件
- NSURL *url = [NSURL URLWithString:urlAddress];
- //建立一個NSURLRequest物件
- NSURLRequest *requestObj = [NSURLRequest requestWithURL:url];
- //建立一個UIWebView 物件
- UIWebView *webView = [[UIWebView alloc] initWithFrame:[self.view frame]];
- //讓 UIWebView 連上NSURLRequest 物件所設定好的網址
- [webView loadRequest:requestObj];
- //將 UIWebVeiw 物件加入到現有的 View 上
- [self.view addSubview:webView];
- //釋放 UIWebView佔用的記憶體
- [webView release];
上面程式碼執行的結果:
它會顯示出完整的網頁,但網頁內容太多、太雜,我們只要顯示我們需要的部份。
取出 HTML 片段,重新用另外一個方法來讓 UIWebView 直接讀取 HTML 字串:
- //建立一個UIWebView 物件
- UIWebView *webView = [[UIWebView alloc] initWithFrame:[self.view frame]];
- //設定要顯示的 HTML 字串
- NSString *htmlString = @"<img src=\"/images/share_icon.gif\"><br/><a href=\"/profile?id=20001913\"><img src=\"/avatars/20001913.jpg\" width=\"65\" border=\"0\"></a><p><a href=\"/profile?id=20001913\">cafequeen</a> iT邦初學者 2級</p><h3>[有話大聲說]大老闆來臥底</h3><p>上周看了一篇新聞,<a href=\"http://dailynews.sina.com/bg/news/int/ausdaily/20101018/17451917146.html\">航空老闆 卧底當菜鳥空少</a>內心上演無限想像…<br />哇~如果大老闆真的臥底在你我身邊,會發生什麼事呢??<br />飛上枝頭當鳳凰?<br />一步登天?<br />還從此淪落為黑面蔡?</p><br>";
- //讓 UIWebView 讀取所設定好的 HTML 字串
- [webView loadHTMLString:htmlString baseURL:[NSURL URLWithString:@"http://ithelp.ithome.com.tw"]];
- //將 UIWebVeiw 物件加入到現有的 View 上
- [self.view addSubview:webView];
- //釋放 UIWebView佔用的記憶體
- [webView release];
上面程式碼執行的結果:
轉貼:http://ithelp.ithome.com.tw/question/10057790
- Apr 08 Wed 2015 00:28
WebView之js调用Android类的方法传递数据 - 依凡王子
1,具体的思路如下:
在android中写一个Activity,里面写一个webview,这个webview加载本地的一个html文件,显示这个网页,这个网页包括一个用户名和密码的输入框和两个按钮(只有登陆按钮有用),输入用户名密码之后调用android中的类,并把输入的数据传过去,再在android中输出出来(具体你那数据做什么操作就看你的需求了),这样就做大额js与android数据交互的效果了:
在android端,一些webviwe的设置和自定义类的写法如下源码:
package com.example.webview;
import android.app.Activity;
import android.os.Bundle;
import android.webkit.JavascriptInterface;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
- Apr 08 Wed 2015 00:27
Android开发学习笔记:浅谈WebView
- Apr 08 Wed 2015 00:21
放弃WebView,使用Crosswalk做富文本编辑器
为什么放弃WebView
Android WebView做普通浏览还好,做富文本编辑器(执行js:document.body.contentEditable=true;
),常常会遇到各种奇葩的bug,而且很难修复。
尽管Google在版本迭代中不断修复bug,但依旧没法用它来做富文本编辑。
Kitkat的改变
Google为了加强WebView的功能,在Kitkat引入了Chromium内核。但还是存在着编辑的bug。
我所知道的一个bug是:
Kitkat版WebView在删除Html标签时处理不好,例如<img>
标签,就无法删除。点击删除时直接越过此元素,将光标定位在图片前方,对图片不做处理。
当然,这个bug在Android 5.0 修复了。
Lollipop新策略
Although WebView has been based on Chromium since Android 4.4, the Chromium layer is now updatable from Google Play.
As new versions of Chromium become available, users can update from Google Play to ensure they get the latest enhancements and bug fixes for WebView, providing the latest web APIs and bug fixes for apps using WebView on Android 5.0 and higher.
可见在Lollipop里,可以通过GooglePlay来更新Chromium内核。
但是问题来了:
- Apr 08 Wed 2015 00:20
Android WebView exploit 的漏洞示範 Android WebView exploit 的漏洞示範
Android WebView exploit 的漏洞示範
Android WebView exploit 的漏洞示範
在 Android 的 SDK 中封裝了 WebView 控制項。在程序中載入 WebView 控制項,主要用於設置屬性(顏色,字體等)。
而在 WebView 下有一個非常特殊的函數 addJavascriptInterface (Object object, String name) method 能實現 Java 和 JavaScript 之間的交互作用,因此可以利用 addJavascriptInterface 這個函數來實做透過 WebView 安裝惡意程式藉此控制 Android 手持式裝置。
在原文的範例中使用具有漏洞的應用程式,需具有 SMS 權限(android.permission.SEND_SMS),並利用惡意的 JavaScript 來發送詐騙的SMS簡訊。
原文出處:http://blogs.avg.com/mobile-2/analyzing-android-webview-exploit/
轉載自《網路攻防戰》
- Apr 08 Wed 2015 00:18
Android WebView放大縮小縮放
一般情況下通過設置一下參數縮放
- Apr 08 Wed 2015 00:17
隱藏android WebView 高亮選擇框
結合HTML+CSS+JS+phonegap來開發移動APP開始廣泛應用,最簡單方法就是把phonegap當作一個WebView來載入本地代碼。在測試過程中發現每當點擊頁面元素時,android模擬器就會預設顯示一個高亮的邊框,像這樣:
- Apr 08 Wed 2015 00:17
[Android] webview選擇文字
package com.brandontate.androidwebviewselection;
import org.json.JSONException;
import org.json.JSONObject;
import com.blahti.drag.DragController;
import com.blahti.drag.DragLayer;
import com.blahti.drag.DragListener;
import com.blahti.drag.DragSource;
import com.blahti.drag.MyAbsoluteLayout;
- Apr 08 Wed 2015 00:16
[Android] WebView ZoomControls
1
2
3
4
5
6
7
8
|
- Apr 08 Wed 2015 00:13
[IPHONE]WebView里嵌本地图片的方法(用js)
如显示图片:
<img src="" id="myimg"/> <script> var url = document.location.href.substring(0,document.location.href.indexOf(window.document.location.pathname)) + document.location.pathname.substring(0,document.location.pathname.lastIndexOf("/")+1); var imgurl=url+"myimg.png"; document.getElementById("myimg").src=imgurl; </script> |
设置背景图片:
var url = document.location.href.substring(0,document.location.href.indexOf(window.document.location.pathname)) + document.location.pathname.substring(0,document.location.pathname.lastIndexOf("/")+1); document.body.style.backgroundImage="url('"+url+"mybackground.png')"; |
- Apr 08 Wed 2015 00:12
android webview 截圖快照