原理:WebView加载Url完成后,注入js脚本,脚本代码使用W3C的PerformanceTimingAPI

往js脚本传入一个Android对象(代码中为AndroidObject),在js脚本中调用AndroidObject中的接口,以此方式将结果传回到Android代码中。

可获取的信息

坑(注意)

  1、WebViewClent的onPageFinished()方法在不同的机型下会有不同的回调情况,在所测机型中魅族Pro6只会在全部网页资源加载完成以及 webView.getProgress()==100 的情况下才会回调,且只会回调一次,华为Mate7则会在所有加载网页资源尚未加载完成( webView.getProgress()<100 )时就会回调,而且即使 webView.getProgress()==100 的情况下也会回调多次,时间难以把握,此时需自己另外加判断,只有在 webView.getProgress()==100 的情况下才执行脚本,且只能执行一次。造成此种情况的原因为WebViewClent底层JNI对不同浏览器内核的适应情况较差,WebChromeClient的onProgressChanged()方法不会出现这种情况。

  2、注入js脚本之后需要延时一段时间才能销毁WebView,否则将收不到js返回来的结果,不能在onPageFinished()中(主线程)做耗时操作,需要另外开启一个线程去做延时关闭,然后通过消息机制将销毁WebView的msg发送给Handler处理,在主线中才能销毁WebView。

  3、在初始化WebView时是通过 WebView mWebView = new WebView(mContext); 方式,所以在销毁WebView时出现了坑,一开始是使用如下方式进行WebView销毁,但是发现run()方法不被调用,但是hasEnqueue却返回的true,查看文档发现即使在enqueue的情况下该Runnable也并不一定会调用,最后使用 mHandler = new Handler(Lopper.getMainLooper()){...} 方法解决了问题。

                 boolean hasEnqueue = mWebView.postDelayed(new Runnable() {
@Override
public void run() {
//didn't step into here
if (mWebView != null) {
mWebView.clearCache(true);
mWebView.clearHistory();
mWebView.destroy();
mWebView = null;
}
}
}, 500);
if(hasEnqueue){
Logger.d("the Runnable was successfully placed in to the message queue.");
}else{
Logger.d("the Runnable was failed to be placed in to the message queue.");
}

使用mWebView.postDelayed销毁mWebView

    Handler mHandler = new Handler(Looper.getMainLooper()) {
@Override
public void handleMessage(Message msg) {
switch (msg.what) {
case MSG_DESTROY: {
destroyWebView();
break;
}
default:
super.handleMessage(msg);
}
}
};

使用mHandler.handleMessage()销毁mWebView

执行结果

     

可通过修改注入的js脚本获取更多详细信息。

代码

         final MyWebView mWebView = new MyWebView(mContext);
mWebView.setVisibility(View.GONE); WebSettings setting = mWebView.getSettings();
setting.setJavaScriptEnabled(true);
setting.setCacheMode(WebSettings.LOAD_NO_CACHE);
setting.setLoadsImagesAutomatically(false); MyWebViewClient myWebViewClient = new MyWebViewClient();
myWebViewClient.setTimeOut(timingCheck.getTimeout());
mWebView.setWebViewClient(myWebViewClient); mWebView.setAndroidObject(new AndroidObject() {
@Override
public void handleError(String msg) {
Logger.d("AndroidObject,错误信息:" + msg);
} @Override
public void handleResource(String jsonStr) {
Logger.d("AndroidObject,Timing信息:" + jsonStr);
}
});
mWebView.loadUrl("http:www.qq.com/");

Main.java

 import android.graphics.Bitmap;
import android.net.http.SslError;
import android.os.Handler;
import android.os.Looper;
import android.os.Message;
import android.webkit.SslErrorHandler;
import android.webkit.WebResourceError;
import android.webkit.WebResourceRequest;
import android.webkit.WebResourceResponse;
import android.webkit.WebView;
import android.webkit.WebViewClient; import com.gomo.health.plugin.plugin.Constants;
import com.gomo.health.plugin.utils.Logger; import java.util.Timer;
import java.util.TimerTask;
import java.util.concurrent.atomic.AtomicBoolean; /**
* Created by s_x_q on 2017/4/11.
*/
public class MyWebViewClient extends WebViewClient { private WebView mWebView;
private AndroidObject mAndroidObject; /**
* WebView不支持修改Timeout , 这里自定义
*/
private int mTimeOut = 3000;
private int mJsTimeout = 500; private Timer mTimer = new Timer(); /**
* 避免重复执行mWebsiteLoadTimeoutTask
*/
private boolean isWebTimeoutTaskScheduling = false; /**
* 避免重复执行mJsInjectTimeoutTask
*/
private boolean isJsTimeoutTaskScheduling = false; /**
* 判断网页加载是否完成
*/
private AtomicBoolean isWebLoadFinished = new AtomicBoolean(false); private TimerTask mWebsiteLoadTimeoutTask = new TimerTask() {
@Override
public void run() {
if (mWebView != null && !isWebLoadFinished.get()) {
sendWebsiteLoadTimeoutMsg();
}
}
}; private TimerTask mJsInjectTimeoutTask = new TimerTask() {
@Override
public void run() {
if (mWebView != null && mAndroidObject != null) {
if (!mAndroidObject.isDataReturn()) {
sendJsInjectTimeoutMsg();
} else {
sendDestroyMsg();
}
}
}
}; final Handler handler = new Handler(Looper.getMainLooper()) {
@Override
public void handleMessage(Message msg) {
switch (msg.what) {
case Constants.HandlerMessage.MSG_DESTROY: {
destroyWebView();
break;
}
case Constants.HandlerMessage.MSG_WEBSITE_LOAD_TIMEOUT: {
if (mWebView != null) {
Logger.d("网页加载超时 , WebView进度:" + mWebView.getProgress() + " , url:" + mWebView.getUrl());
if (mWebView.getProgress() < 100) {
mAndroidObject.handleError("LoadUrlTimeout");
destroyWebView();
}
}
break;
}
case Constants.HandlerMessage.MSG_JS_INJECT_TIMEOUT: {
if (mWebView != null) {
if (mAndroidObject != null) {
if (!mAndroidObject.isDataReturn()) {
Logger.d("JS注入脚本执行超时");
String format = "ExecuteJsTimeout(%dms)";
mAndroidObject.handleError(String.format(format, mJsTimeout));
destroyWebView();
}
}
}
break;
} default:
super.handleMessage(msg);
}
}
}; @Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
Logger.d("网页开始加载:" + url); if (mWebView == null) {
mWebView = view;
if (mWebView instanceof MyWebView) {
mAndroidObject = ((MyWebView) mWebView).getAndroidObject();
}
}
setupWebLoadTimeout();
} @Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
//只会重定向时回调,然后回调onPageStarted
// Logger.d("回调旧版shouldOverrideUrlLoading , url :" + url);
return super.shouldOverrideUrlLoading(view, url);
} @Override
public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
//只会重定向时回调,然后回调onPageStarted
// Logger.d("回调新版shouldOverrideUrlLoading , request method :" + request.getMethod() + "\t是否为重定向: " + request.isRedirect() + "\trequest url :" + request.getUrl());
return super.shouldOverrideUrlLoading(view, request);
} @Override
public WebResourceResponse shouldInterceptRequest(WebView view, String url) {
//每次请求资源的时候都会在onLoadResource前回调,可用于拦截资源加载,修改request
// Logger.d("回调旧版shouldInterceptRequest , url :" + url);
return super.shouldInterceptRequest(view, url);
} @Override
public WebResourceResponse shouldInterceptRequest(WebView view, WebResourceRequest request) {
//每次请求资源的时候都会在onLoadResource前回调,可用于拦截资源加载,修改request
// Logger.d("回调新版shouldInterceptRequest " );
return super.shouldInterceptRequest(view, request);
} @Override
public void onLoadResource(WebView view, String url) {
super.onLoadResource(view, url);
// Logger.d("加载网页资源 , url:" + url + " , WebView进度:" + view.getProgress());
} public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url); Logger.d("网页加载完成,WebView进度:" + view.getProgress()); //可能会在进度<100或==100的情况下出现多次onPageFinished回调
if (view.getProgress() == 100 && !isWebLoadFinished.get()) {
Logger.d("注入js脚本");
//可能会回调多次
isWebLoadFinished.set(true);
String format = "javascript:%s.sendResource(JSON.stringify(window.performance.timing));";
String injectJs = String.format(format, MyWebView.ANDROID_OBJECT_NAME);
view.loadUrl(injectJs); setupJsInjectTimeout();
}
} @Deprecated
@Override
public void onReceivedError(WebView view, int errorCode,
String description, String failingUrl) {
super.onReceivedError(view, errorCode, description, failingUrl);
Logger.d("回调旧版本onReceivedError():" + "错误描述:" + description + "\t错误代码:" + errorCode + "失败的Url:" + failingUrl); handleError(description);
} @Override
public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
super.onReceivedError(view, request, error);
Logger.d("回调新版本onReceivedError:");
} @Override
public void onReceivedHttpError(WebView view, WebResourceRequest request, WebResourceResponse errorResponse) {
super.onReceivedHttpError(view, request, errorResponse);
Logger.d("回调onRecivedHttpError:");
handleError("onReceivedHttpError");
} @Override
public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
super.onReceivedSslError(view, handler, error);
Logger.d("回调onReceivedSslError():" + "\terror:" + error.toString());
handleError("onReceivedSslError");
} private void handleError(String msg) {
isWebLoadFinished.set(true);
sendDestroyMsg();
if (mAndroidObject != null) {
mAndroidObject.handleError(msg);
} } public int getTimeOut() {
return mTimeOut;
} public void setTimeOut(int timeOut) {
mTimeOut = timeOut;
} /**
* 网页加载计时
*/
private void setupWebLoadTimeout() {
if (!isWebTimeoutTaskScheduling) {
isWebTimeoutTaskScheduling = true;
mTimer.schedule(mWebsiteLoadTimeoutTask, mTimeOut);
}
} /**
* 注入js脚本执行计时
* <p>
* 注入js之后等待一段时间,如果这段时间内js不回调AndroidObject.handleResource(),则再销毁WebView
* 过早销毁WebView,js不回调AndroidObject.handleResource()
*/
private void setupJsInjectTimeout() {
if (!isJsTimeoutTaskScheduling) {
isJsTimeoutTaskScheduling = true;
if (mAndroidObject != null) {
mAndroidObject.setStartTime(System.currentTimeMillis());
}
mTimer.schedule(mJsInjectTimeoutTask, mJsTimeout);
}
} private void sendDestroyMsg() {
handler.sendEmptyMessage(Constants.HandlerMessage.MSG_DESTROY);
} private void sendWebsiteLoadTimeoutMsg() {
handler.sendEmptyMessage(Constants.HandlerMessage.MSG_WEBSITE_LOAD_TIMEOUT);
} private void sendJsInjectTimeoutMsg() {
handler.sendEmptyMessage(Constants.HandlerMessage.MSG_JS_INJECT_TIMEOUT);
} private void destroyWebView() {
if (mWebView != null) {
mWebView.clearCache(true);
mWebView.clearHistory();
mWebView.destroy();
mWebView = null;
Logger.d("成功销毁WebView");
} else {
Logger.d("销毁失败,WebView为空");
}
} }

MyWebViewClient.java

 import android.webkit.JavascriptInterface;

 /**
* Created by s_x_q on 2017/4/11.
*/ public abstract class AndroidObject { private volatile boolean mIsDataReturn = false ;
private long startTime ;
private long endTime ; /**
*用于收集Timing信息
*
* @param jsonStr
*/
@JavascriptInterface
public void sendResource(String jsonStr) {
mIsDataReturn = true ;
endTime = System.currentTimeMillis();
Logger.d("js成功执行时间:" + (endTime-startTime));
handleResource(jsonStr);
} /**
* 用于收集js的执行错误
* @param msg
*/
@JavascriptInterface
public void sendError(String msg) {
handleError(msg);
} /**
* 处理错误信息,可能会被回调多次
* @param msg
*/
public abstract void handleError(String msg) ; /**
*
* @param jsonStr
*/
public abstract void handleResource(String jsonStr); public boolean isDataReturn() {
return mIsDataReturn;
} public long getStartTime() {
return startTime;
} public void setStartTime(long startTime) {
this.startTime = startTime;
} public long getEndTime() {
return endTime;
} public void setEndTime(long endTime) {
this.endTime = endTime;
}
}

AndroidObject.java

package com.sxq.webviewperformancemonitor;

import android.content.Context;
import android.util.AttributeSet;
import android.webkit.WebView; /**
* Created by shixiaoqiangsx on 2017/4/11.
*/
public class MyWebView extends WebView { public final static String ANDROID_OBJECT_NAME = "android"; private AndroidObject mAndroidObject = null; public MyWebView(Context context) {
this(context, null, 0);
} public MyWebView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
} public MyWebView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
} public void setAndroidObject(AndroidObject object) {
if (object == null) {
Logger.d("AndroidObject can not be null !");
this.mAndroidObject = new AndroidObject() {
@Override
public void handleError(String msg) {
} @Override
public void handleResource(String jsonStr) {
}
};
} else {
this.mAndroidObject = object;
} super.addJavascriptInterface(mAndroidObject, ANDROID_OBJECT_NAME);
} protected AndroidObject getAndroidObject() {
return this.mAndroidObject;
}
}

MyWebView.java

项目地址

WebViewPerformanceMonitor

拓展:

Performance Timing API :

W3C:A Primer for Web Performance Timing APIs

Google:测量资源加载时间

Google:了解资源耗时

W3C:Resource Timing Level 3

WebView开发:

WebView开发之坑

WebView拦截过滤Url:

GoogleChrome高级WebView应用实例,官方Chromium WebView Sample

Android 拦截WebView加载URL,控制其加载CSS、JS资源,WebView缓存

Webview资源请求的拦截

Android中WebView中拦截所有请求并替换URL

使用WebView监控网页加载状况,PerformanceMonitor,WebViewClient生命周期的更多相关文章

  1. 「小程序JAVA实战」 小程序默认加载的页面和生命周期(八)

    转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-08/ 小程序如何加载的呢?生命周期!源码:https://github.com/limingios ...

  2. mpvue 页面预加载,新增preLoad生命周期

    存在的必要性:mpvue开发微信小程序,在页面跳转到新页面的过程中会有200ms左右的延迟,这个200ms如果用来请求新页面的接口,那么跳转到新页面或许已经渲染好了页面. 就是两种方式: 1.新页面跳 ...

  3. Java-类加载(类的生命周期)

    类从被加载到虚拟机内存开始,到卸载出内存为止. 解析阶段在某些情况下可以在初始化后再开始,这是为了支持 Java 语言的运行时绑定. 一.类加载时机 JVM 规范没有强制约束类加载过程的第一阶段(加载 ...

  4. 1. spring5源码 -- Spring整体脉络 IOC加载过程 Bean的生命周期

    可以学习到什么? 0. spring整体脉络 1. 描述BeanFactory 2. BeanFactory和ApplicationContext的区别 3. 简述SpringIoC的加载过程 4. ...

  5. Activity的生命周期与加载模式——Activity的生命周期演示

    当Activity处于Android应用中运行时,它的活动状态由Android以Activity栈的形式管理.当前活动的Activity位于栈顶.随着不同应用的运行,每个Activity都有可能从活动 ...

  6. WebView 加载网页 加载资源 总结 MD

    Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...

  7. 《动手实现一个网页加载进度loading》

    loading随处可见,比如一个app经常会有下拉刷新,上拉加载的功能,在刷新和加载的过程中为了让用户感知到 load 的过程,我们会使用一些过渡动画来表达.最常见的比如"转圈圈" ...

  8. 浅试 Webview 一app 加载 H5小游戏

    整体架构: InventionActivity:实现UI的实例化,基本的按钮Activity之间跳转 GameActivity:实现UI的实例化,Webview的基本使用 MyProgressDial ...

  9. iOS WKWebView添加网页加载进度条(转)

    一.效果展示 WKWebProgressViewDemo.gif 二.主要步骤 1.添加UIProgressView属性 @property (nonatomic, strong) WKWebView ...

随机推荐

  1. 每天一个linux命令(43)--netstat命令

    netstat 命令用于显示与 IP TCP  UDP 和 ICMP协议相关的统计数据,一般用于检验本机各端口的网络连接情况.netstat 是在内核中访问网络及相关信息的程序,它能提供TCP连接,T ...

  2. C#基础——类

    第一部分:String类 系统内置的处理字符串类型的函数方法类.方便我们对字符串类型进行一系列的处理. +++++String类+++++黑色小扳手 - 属性紫色立方体 - 方法 1.***字符串.L ...

  3. 改变 Panel 跟 groupbox边框样式

    更改panel和groupbox的边框颜色因为在控件的属性中没有设置边框颜色的属性只有一个设置边框样式,遂在网络中搜寻出一下方法: panel的边框颜色在paint中重新对颜色进行定义 private ...

  4. AR入门系列-04-vuforia识别多个图片及同屏展示

    首先,我们需要在官网中识别数据库添加多张图片,并将数据库下载下来覆盖原来的数据库 在 Hierarchy视图中需要多个ImageTarget 将新建的ImageTarget(1) 选择数据库中的识别图 ...

  5. Django之Cookie

    Cookie 在浏览器端(客户端)保存的键值对,特性:每次http请求都会携带.           举个例子:{"name":身份证号} 1丶获取cookie request.C ...

  6. Django and Djangorestframework

    NOte Today, another day debuging with my teammates, and I just tried to make complete comprehension ...

  7. 从数据库读取二进制图片,img标签显示图片

    引自 http://www.w3dev.cn/article/20110214/asp-net-csharp-image-base64-change.aspx      <img src=&qu ...

  8. Fundebug上线Node.js错误监控啦

    作为全栈JavaScript错误实时监测平台,Fundebug的Node.js实时错误监测服务上线啦,我们能够帮助开发者及时,高效地发现并且解决Node.js错误,从而提高开发效率,并提升用户体验. ...

  9. spdlog源码阅读 (2): sinks的创建和使用

    2. sink创建 2.1 还是rotating_file_sink 我们仍然以rotating_file_sink为例来说明在spdlog中sink的创建过程. 在spdlog-master/tes ...

  10. Git远程仓库(二)

    昨天讲了Git安装使用和基本的命令,今天我说一下如何通过Git将本地管理的仓库添加到远程库 首先我们需要在www.github.com(如果打不开网页,请注意科学上网)上注册一个免费的账号,邮箱验证完 ...