解决Webview加载不完全导致部分js无效

简介: 问题出现有两种情况:一种情况是打开activity时webview开始加载页面,但是发现加载了一部分后就停止了,余下的一直不再加载。但是当关闭这个activity时发现webview又继续加载了。第二种情况是webview正常加载,但是进行操作时发现有些操作没有反应。比如接入支付宝国际sdk,未装支付宝app而使用h5页面时出现点击无反应的情况。

问题出现


有两种情况: 一种情况是打开activity时webview开始加载页面,但是发现加载了一部分后就停止了,余下的一直不再加载。但是当关闭这个activity时发现webview又继续加载了。

第二种情况是webview正常加载,但是进行操作时发现有些操作没有反应。比如接入支付宝国际sdk,未装支付宝app而使用h5页面时出现点击无反应的情况。


问题解析


进过反复测试发现,是因为有两个含有webview的activity:activityA和activityB。在activityA的onPause和onResume中分别有mWebView.pauseTimers()mWebView.resumeTimers(),但是activityB中没有。先打开activityA加载web页面,然后打开activityB,因为activityB没有resumeTimers,他的部分js未成功加载,所以出现上面的现象。


问题根源


问题的根源就是WebView的pauseTimers()和resumeTimers()这两个方法。它们的源码及注释如下


/**
 * Pauses all layout, parsing, and JavaScript timers for all WebViews. This
 * is a global requests, not restricted to just this WebView. This can be
 * useful if the application has been paused.
 */
public void pauseTimers() {
    checkThread();
    mProvider.pauseTimers();
}
/**
 * Resumes all layout, parsing, and JavaScript timers for all WebViews.
 * This will resume dispatching all timers.
 */
public void resumeTimers() {
    checkThread();
    mProvider.resumeTimers();
}
复制代码


可以看到这两个方法都是全局的,可以停止所有WebView的加载。所以当打开activityB的时候走了activityA的生命周期onPause,这样执行了pauseTimers(),而因为是全局的所以作用到所有的webview,所以activityB的webview也被pause而停止了加载,同时因为activityB的生命周期中并没有实现这两个函数,所以在pauseTimers()后没有执行resumeTimers(),所以activityB的web页面被pause后也没有恢复,这样就导致了一部分js代码没有加载,这样相关的效果就失效了。


解决方法


通过上面分析,其实我们就知道该如何解决了,在activityB的onPause和onResume中也加入mWebView.pauseTimers()mWebView.resumeTimers()即可。但是像我们前面说的第二种情况,我们使用的是第三方sdk的话,那么我们是没办法对其进行修改的,我们可以将activityA中的mWebView.pauseTimers()mWebView.resumeTimers()方法去掉来保证页面正常。


最后注意,webview还有onPause()onResume这两个方法。这两个方法与pauseTimers()resumeTimers()不同,他们两个是作用范围在当前webview的。而且作用效果也不同:onPause()会立刻停止当前webview的加载;而pauseTimers()会停止所有webview的延时加载,即那些等待timeout才执行的function,并且不执行resumeTimers()就不会加载。



目录
相关文章
|
1月前
|
JavaScript 前端开发 Go
动态加载与异步加载 JavaScript 详解:加载远程js,加载成功后执行回调函数
动态加载与异步加载 JavaScript 详解:加载远程js,加载成功后执行回调函数
222 1
|
12天前
|
Android开发 UED Kotlin
kotlin webview 加载网页失败后如何再次重试
在Kotlin中,当使用WebView加载网页失败时,可通过设置WebViewClient并覆盖`onReceivedError`方法来捕获失败事件。在该回调中,可以显示错误信息或尝试使用`reload()`重试加载。以下是一个简要示例展示如何处理加载失败
|
14天前
|
JavaScript 前端开发 Android开发
kotlin开发 webview如何在收到JS调用后,native返回数据给到JS
这段内容描述了在Hybrid App开发中,使用Kotlin的Compose构建的Web视图(WebView)如何通过JsBridge实现JavaScript与原生代码的交互
|
1月前
|
JavaScript 前端开发 数据可视化
Three.js第2篇,加载glb / gltf模型,Vue加载glb / gltf模型(如何在vue中使用three.js,vue使用threejs加载glb模型)
Three.js 是一个用于在 Web 上创建和显示 3D 图形的 JavaScript 库。它提供了丰富的功能和灵活的 API,使开发者可以轻松地在网页中创建各种 3D 场景、模型和动画效果。可以用来展示产品模型、建立交互式场景、游戏开发、数据可视化、教育和培训等等。这里记录一下如何在Vue项目中使用Three.js
127 4
Three.js第2篇,加载glb / gltf模型,Vue加载glb / gltf模型(如何在vue中使用three.js,vue使用threejs加载glb模型)
|
3天前
|
缓存 JavaScript 前端开发
老程序员分享:js刷新页面得重新加载和页面的刷新
老程序员分享:js刷新页面得重新加载和页面的刷新
|
9天前
|
前端开发 JavaScript
阿里云验证码2.0 验证时报错 前端页面获取的验证参数有问题,动态JS加载失败,请问怎么解决啊?急,急,急。
用户反馈校验时遇到错误,日志显示验证码参数获取异常。采用无痕验证,失败后,返回`{captchaResult:false,bizResult:false}`,未触发滑块二次验证。
|
11天前
|
数据采集 前端开发 JavaScript
Python爬虫技术:动态JavaScript加载音频的解析
Python爬虫技术:动态JavaScript加载音频的解析
|
1月前
|
JavaScript
EasyUi js 加载数据进下拉框combobox
EasyUi js 加载数据进下拉框combobox
|
1月前
|
JavaScript 前端开发
EasyUi js 加载数据表格DataGrid
EasyUi js 加载数据表格DataGrid
|
1月前
|
JavaScript
理解DOM树的加载过程(js的问题)
理解DOM树的加载过程(js的问题)
13 0