android JSBridge的加载时机问题

news2024/11/27 2:37:23

https://github.com/lzyzsd/JsBridge 也算是比较悠久和使用了。
可供参考的android和IOS,以及前端的使用 https://segmentfault.com/a/1190000018208609

遇到的问题:
比如:

  1. 从前端在加载WebView的时候,执行了某些动作,一直得不到回应,过一会儿会瞬间刷刷刷执行多次;
  2. 某个初始化指令,前端是调用了,但是android端需要等很久才能生效,或者不生效。

上述类似的问题,可以研究下我这段分析。

WebView和Html加载时机的关系

这里我不做更深入的讨论。简要地解释下:
android的WebView,其实就是Chrome的内核,与我使用过CEF框架,javafx等Webkit内核其实类似。

标准浏览器,做到客户端上,WebView(不是android也会类似有)2个函数:
public void onPageStarted(xxx)
public void onPageFinished(xxx)
onLoadResource(xxx, url)

  • onLoadResource,指代的是,跳转新url,或者内部中转的url,又或者加载某图片资源,视频资源之前的回调,因此我们这里在这里进行一些url跳转或者做无图浏览,或者做爬虫的时候,加速加载,那么我们可以进行一些拦截;

  • onPageStarted, 指代的是,开始加载url,每一次有一个新的url需要打开都会执行,那么,它可能会有多次执行;

  • onPageFinished,指代的是,其实对应的是,网页所有的资源,DOM全部准备好了才回调。而这个回调,可能是很难完成的,比如JS有些无法加载,某些资源需要下载很久很慢;

JSBridge代码分析

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
从上述,可以看出,jsbridge的框架中,需要等待onPageFinished以后,才会干2个事情:

第一,加载js代码,初始化jsbridge,通知ready:
执行WebViewJavascriptBridge.js的代码,主要是通知’WebViewJavascriptBridgeReady"。
而前端JS代码中:
document.addEventListener(
‘WebViewJavascriptBridgeReady’,
function () {
registerAppEvent()
isInitBridgeEvent = true
},
false
)
进行了注册,监听,等待着native的通知ready。

第二,执行JS的排队中的指令队列:
我们可以看到android jsbridge库代码中,做了一个startupMessage的队列,用来存储前端发下来的执行,等待onFinish才将它统一执行和干活。

解决方案

看到这里,那么,针对前面的2个问题就迎刃而解了。
在BridgeWebViewClient里面:

   private var isLoadedBridgeJs = false

mBinding.webView.webViewClient = object : BridgeWebViewClient(mBinding.webView) {
            override fun onPageStarted(view: WebView?, url: String?, favicon: Bitmap?) {
                super.onPageStarted(view, url, favicon)
                lifecycleScope.launch {
                    delay(500)
                    if (!isLoadedBridgeJs) { //父类执行了js的逻辑,则这里不再需要处理
                        isLoadedBridgeJs = true
                        //**warn** jsbridge的代码逻辑: onPageFinished才进行初始化逻辑;
                        // 而Finished的时机可能非常晚(网页的dom资源需要加载完成才算数)!
                        // 而started则很快。
                        //常规不能这样调用,这里因为父类BridgeWebViewClient 的finish只做了JS和处理排队事务,才能这样调用。不理清楚逻辑,不得任意修改。
                        super.onPageFinished(view, url)
                    }
                }
                ///xxxx
            }

            override fun onPageFinished(view: WebView?, url: String?) {
                super.onPageFinished(view, url)
                isLoadedBridgeJs = true //父类执行了js的逻辑,则这里不再需要处理
                //xxxx
            }
        }
    }

这里是通过delay一段时间,来裸调用父类的onPageFinished。因为父类的onPageFinished函数里面的干的活,很纯粹,才这样写。
否则还是尽量去继承或者下载库代码来改造。

并且从JS代码可以看出,多次执行并不影响。 if (window.WebViewJavascriptBridge) { return; }有做拦截。

同时,delay(500)的时间,最好是大一点没有关系,建议300-800ms。
因为默认情况,onPageFinished会比较快回调(没有大资源和错误JS,资源的情况下)。
那么,我们的代码通过isLoadedBridgeJs来控制,就不会执行。而是库自行执行了。

如果,500ms,还没有finished来,我们先执行一次,初始化好JSBridge,同时执行一下js端的初始化任务。
等到真正的finished来了以后,再次执行默认的,并没什么影响。

具体的版本具体分析参考。
目前的代码参考的是jsbridge1.0.4。
据我来看1.0.5也照样会有这样的问题。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/753394.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Java/大数据】Kafka简介

Kafka简介 Kafka概念关键功能应用场景 Kafka的原理Kafka 的消息模型早期的队列模型发布-订阅模型Producer、Consumer、Broker、Topic、PartitionPartitionoffsetISR Consumer Groupleader选举Controller leaderPartition leader producer 的写入流程 多副本机制replicas的同步时…

介绍AI绘画课,让智能工具助力创作 释放无限想象力 助你成为绘画大师

演示地址: www.runruncode.com/portal/article/index/id/19458/cid/81.html 画画是一项有趣的活动,它让人充满无限可能。对许多人来说,画画既是一种放松的方式,也是一种与创意、文化和艺术联系的途径。如果你是一个初学者&#x…

《深度学习推荐系统》笔记

目录 一、推荐系统是什么1.作用和意义2.推荐系统的架构2.1 逻辑架构2.2 技术架构 二、传统的推荐系统方法1. 协同过滤算法1.1 userCF&&ItemCF1.3 矩阵分解算法 2. 逻辑回归算法3. 因子分解机3.1 POLY2模型3.2 FM模型3.3 FFM模型3.4 小结 4. 组合模型4.1 GBDTLR组合模型…

valle代码过程

github代码链接 https://github.com/lifeiteng/vall-e/tree/main1.PyTorch pytorch官网 https://pytorch.org/指令 conda install pytorch torchvision torchaudio pytorch-cuda11.8 -c pytorch -c nvidiapip install torchmetrics0.11.12.fbank pip install librosa0.8.1…

前端vue入门(纯代码)33_缓存路由组件

如果我一贫如洗,你将会是我最后一件行李。 【31.Vue Router--缓存路由组件】 背景:在Cartoon组件的input框,输入了一些数据的时候,但是,当我切换到Stars组件的时候,那么Cartoon组件就会被销毁&#xff0c…

易基因“多区域DNA甲基化检测探针设计及其检测方法”获专利授权!

大家好,这里是专注表观组学十余年领跑多组学科研服务的易基因。 DNA甲基化是表观遗传学研究中,修饰最为稳定,含量最为丰富,对基因调控最为活跃、途径最为广泛的一种修饰。不同基因区域或位点的修饰与胚胎发育、疾病发生和发展密切…

三层架构详解

什么是三层架构? 三层架构就是为了符合“高内聚,低耦合”思想,是一种十分完善的软件应用程序架构,它将应用程序组织成三个逻辑和物理计算层:表示层(或用户界面)、应用层(负责处理数据…

Java中abstract关键字

文章目录 由来语法格式使用说明应用举例 由来 举例1: 随着继承层次中一个个新子类的定义,类变得越来越具体,而父类则更一般,更通用。类的设计应该保证父类和子类能够共享特征。有时将一个父类设计得非常抽象,以至于它…

数字赋能,你见过哪些科技感爆棚的VR数字展厅呢?

随着科技的不断进步,线上展厅作为一种新型的展示方式,在社会层面得到了广泛的认可和应用,VR数字展厅带给观众不一样的视觉震撼感,大大提升了品牌的价值。 传统的功能性展馆或是展厅千篇一律,缺乏品牌特色以及趣味性&am…

springboot之配置文件加载

springboot启动流程参考。Springboot总结。本内容主要解析里面的配置文件的加载过程。 springboot资源加载 入口。SpringApplication#run 我们知道,run方法是构建容器的过程。里面有一个方法:prepareEnvironment。用于构建环境组件Environment&#xf…

【ArcGIS Pro二次开发】(48):三调土地利用现状分类面积汇总统计

之前做了一个三调三大类面积统计,有小伙伴反映太粗糙,想要一个完整的地类面积汇总表。 【ArcGIS Pro二次开发】(35):三调三大类面积统计 本质上并没有多少难度,之前也做过类似的用地用海汇总表,于是拿出来改一改就好了…

3D开发工具HOOPS 2023 SP2更新:增加了SOLIDWORKS贴花支持!

HOOPS SDK是全球领先开发商TechSoft 3D旗下的原生产品,专注于Web端、桌面端、移动端3D工程应用程序的开发。长期以来,HOOPS通过卓越的3D技术,帮助全球600多家知名客户推动3D软件创新,这些客户包括SolidWorks、SIEMENS、Oracle、Ar…

几款好用软件,嗐,朋友推荐的,真香

1、git加速 官网:https://steampp.net/ 2、gif 截图 官网:https://www.screentogif.com/

scss 预处理器自定义ui框架(bem架构)

BEM架构 bem架构 它是一种css架构 oocss 实现的一种 (面向对象css) ,BEM实际上是block、element、modifier的缩写,分别为块层、元素层、修饰符层,element UI 也使用的是这种架构 BEM 命名约定的模式是: …

kaggle,球员接触检测

比赛链接 比赛目标 检测球员在NFL橄榄球比赛中所经历的外部接触。你将使用视频和球员跟踪数据来识别与接触的时刻,以帮助提高球员的安全。 评价指标 马修斯相关系数(Matthews Correlation Coefficient,简称MCC)是一种常用的二…

图论算法笔记

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 第12章 最短路径算法12-1 有权图的最短路径问题最短路径问题-路径规划单源最短路径带权图的最短路径和无权图的最短路径带权图的最短路径算法-Dijkstra算法 12-2 Di…

检测到目标Strict-Transport-Security响应头缺失

详细描述 Web 服务器对于 HTTP 请求的响应头中缺少 Strict-Transport-Security,这将导致浏览器提供的安全特性失效。 当 Web 服务器的 HTTP 头中包含 Strict-Transport-Security 头时,浏览器将持续使用 HTTPS 来访问 Web 站点,可以用来对抗协…

Echart柱形图条纹设置

代码内容: option {xAxis: {type: category,data: [Mon, Tue, Wed, Thu, Fri, Sat, Sun]},yAxis: {type: value},series: [{data: [120, 200, 150, 80, 70, 110, 130],type: bar},{data: [20, 40, 90, 40, 30, 70, 120],type: bar},{data: [140, 230, 120, 50, 30, 150, 120]…

利用远程调试获取Chromium内核浏览器Cookie

前言 本文将介绍不依靠DPAPI的方式获取Chromium内核浏览器Cookie 远程调试 首先我们以edge为例。edge浏览器是基于Chromium的,而Chromium是可以开启远程调试的,开启远程调试的官方文档如下: https://blog.chromium.org/2011/05/remote-deb…

8.带你入门matlab 数据统计与分析——区间参数估计 均匀分布(matlab 程序 )

1.简述 本文将涉及到数理统计的最后一个模块——参数估计,后续将更新的模块是多项式计算、数据插值和曲线拟合。 在讲述使用matlab来实现参数估计之前,有必要去了解一些基本原理。 1.离散型随机变量的极大似然估计法: (1) 似然函数 若X为离散型, 似然函数…