CN109271213A - Html5页面的加载方法、装置、计算机设备及存储介质 - Google Patents
Html5页面的加载方法、装置、计算机设备及存储介质 Download PDFInfo
- Publication number
- CN109271213A CN109271213A CN201810949150.5A CN201810949150A CN109271213A CN 109271213 A CN109271213 A CN 109271213A CN 201810949150 A CN201810949150 A CN 201810949150A CN 109271213 A CN109271213 A CN 109271213A
- Authority
- CN
- China
- Prior art keywords
- html5
- html5 page
- script
- page
- load
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明实施例公开了一种HTML5页面的加载方法、装置、计算机设备及存储介质。该方法包括当通过HTML5模块调用网络视图组件以加载HTML5页面时,通过HTML5模块中的JS脚本向原生模块发送监听请求;在原生模块接收到监听请求后,若通过原生模块监听到HTML5页面完成页面样式的加载,通过原生模块向JS脚本发送完成加载反馈信息;在JS脚本接收到完成加载反馈信息后,通过JS脚本运行预设协议以触发预设事件;在原生模块监听到JS脚本触发的预设事件后,通过原生模块将预先存储的交互协议注入至HTML5页面的Window对象中;通过JS脚本加载HTML5页面的数据逻辑以完成HTML5页面的加载。该方法可解决交互协议的注入时差问题,防止交互协议发生泄露,提高终端的网络安全性。
Description
技术领域
本发明涉及计算机技术领域,尤其涉及一种HTML5页面的加载方法、装置、计算机设备及存储介质。
背景技术
HTML5(英文全称:HyperText Markup Language,中文名称:第五代超级文本标记语言),因其引入了强大的绘图、音频播放、视频播放等元素而被广泛应用在混合应用程序中。在混合应用程序中,当加载HTML5页面时,需要注入交互协议以使得HTML5页面可以与混合应用程序中原生模块(英文名称:Native Module)进行交互。
目前,业界主要采用操作系统进行交互协议的注入,这种注入方式容易出现注入时间差。比如,当操作系统选择在加载HTML5页面之前注入交互协议时,就容易因网络等原因在HTML5页面开始加载之后才开始注入交互协议,导致注入时间的延迟。再比如,当操作系统选择在加载完HTML5页面的页面样式之后注入交互协议时,也容易因网络等原因在HTML5页面的页面样式加载完成之前就进行交互协议的注入,导致注入时间的提前。同时,现有的操作系统注入交互协议的方式也会占用操作系统较多的内存和资源,不利于资源的合理分配。
发明内容
本发明实施例提供了一种HTML5页面的加载方法、装置、计算机设备及存储介质,以解决交互协议的注入时差的问题以及交互协议注入占用操作系统较多的内存的问题。
第一方面,本发明实施例提供了一种HTML5页面的加载方法,应用于混合应用程序中,所述混合应用程序包括原生模块和HTML5模块,所述方法包括:当通过所述HTML5模块调用网络视图组件以加载HTML5页面时,通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求;在所述原生模块接收到所述监听请求后,通过所述原生模块监听所述HTML5页面是否完成页面样式的加载;若通过所述原生模块监听到所述HTML5页面完成页面样式的加载,通过所述原生模块向所述JS脚本发送完成加载反馈信息;在所述JS脚本接收到所述完成加载反馈信息后,通过所述JS脚本运行预设协议以触发预设事件;在所述原生模块监听到所述JS脚本触发的所述预设事件后,通过所述原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中,以便于所述JS脚本基于所述交互协议与所述原生模块进行交互访问;以及通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。
第二方面,本发明实施例还提供了一种HTML5页面的加载装置,其包括用于执行上述HTML5页面的加载方法的单元。
第三方面,本发明实施例还提供了一种计算机设备,其包括存储器及处理器,所述存储器上存储有计算机程序,所述处理器执行所述计算机程序时实现上述HTML5页面的加载方法。
第四方面,本发明实施例还提供了一种计算机可读存储介质,所述存储介质存储有计算机程序,所述计算机程序包括程序指令,所述程序指令当被处理器执行时可实现上述HTML5页面的加载方法。
本发明实施例提供了一种HTML5页面的加载方法、装置、计算机设备及存储介质。其中,在该HTML5页面的加载方法中,由于需要通过JS脚本触发预设事件来触发原生模块进行交互协议的注入,同时,在交互协议的注入过程结束之后才通过JS脚本进行数据逻辑的加载以完成加载HTML5页面,这样可以有效地解决交互协议的注入时差的问题。同时,该加载方法也可以减少对操作系统的内存以及资源的消耗。
附图说明
为了更清楚地说明本发明实施例技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1为本发明实施例提供的HTML5页面的加载方法的流程示意图;
图2为本发明实施例提供的HTML5页面的加载方法的另一流程示意图;
图3为本发明实施例提供的HTML5页面的加载方法的子流程示意图;
图4为本发明实施例提供的HTML5页面的加载装置的示意性框图;
图5为本发明实施例提供的HTML5页面的加载装置的另一示意性框图;
图6为本发明实施例提供的HTML5页面的加载装置的另一示意性框图;以及
图7为本发明实施例提供的计算机设备的示意性框图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
应当理解,当在本说明书和所附权利要求书中使用时,术语“包括”和“包含”指示所描述特征、整体、步骤、操作、元素和/或组件的存在,但并不排除一个或多个其它特征、整体、步骤、操作、元素、组件和/或其集合的存在或添加。
还应当理解,在此本发明说明书中所使用的术语仅仅是出于描述特定实施例的目的而并不意在限制本发明。如在本发明说明书和所附权利要求书中所使用的那样,除非上下文清楚地指明其它情况,否则单数形式的“一”、“一个”及“该”意在包括复数形式。
还应当进一步理解,在本发明说明书和所附权利要求书中使用的术语“和/或”是指相关联列出的项中的一个或多个的任何组合以及所有可能组合,并且包括这些组合。
请参阅图1,图1为本发明实施例提供的HTML5页面的加载方法的流程示意图。该HTML5页面的加载方法可以应用于混合应用程序(英文名称:Hybrid APP)中。该混合应用程序安装于手机、平板电脑、台式电脑、IPAD等终端中。
其中,该混合应用程序包括原生模块和HTML5模块。该原生模块是指混合应用程序中用原生的系统语言编写的部分。譬如,对于IOS操作系统而言,原生模块可以采用OC语言编写。对于安卓操作系统而言,原生模块可以采用Java语言编写。该HTML5模块是指混合应用程序中包括HTML5页面的页面样式和JS(英文全称:JavaScript)脚本等组件的部分,其中,该HTML5页面的页面样式包括HTML5页面框架和CSS(英文全称:Cascading StyleSheets,中文名称:层叠样式表)元素,该HTML5页面框架可以为空白的HTML页面。
如图1所示,该HTML5页面的加载方法包括以下步骤S110至S160。
S110、当通过所述HTML5模块调用网络视图组件以加载HTML5页面时,通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求。
在本实施例中,当混合应用程序需要加载HTML5页面时,可以通过HTML5模块调用网络视图组件(英文名称:Webview)来加载HTML5页面。此时,通过HTML5模块中的JS脚本向原生模块发送监听请求。其中,该监听请求用于使得原生模块监听HTML5页面的加载情况。
在一实施例中,如图2所示,图2为本发明实施例提供的HTML5页面的加载方法的另一流程示意图。在通过该HTML5模块中的JS脚本向所述原生模块发送监听请求之前,该加载方法还包括步骤S170和S180。
S170、判断所述HTML5页面是否为所述混合应用程序的HTML5页面。
在本实施例中,在通过HTML5模块中的JS脚本向原生模块发送监听请求之前,需要判断当前加载的HTML5页面是否为混合应用程序自己的HTML5页面。若HTML5页面为混合应用程序的HTML5页面,则执行步骤S110,即执行通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求的步骤。
若HTML5页面不是混合应用程序的HTML5页面,比如,当前加载的HTML5页面为第三方应用的HTML5页面,那么为了原生模块中交互协议的安全性,此时将执行步骤S180。
S180、加载所述HTML5页面的页面样式以及JS脚本以完成所述HTML5页面的加载。
当HTML5页面不是混合应用程序的HTML5页面时,此时,直接加载HTML5页面,即直接加载HTML5页面的页面样式和JS脚本,并不需要进行交互协议注入的操作,从而保证原生模块中交互协议的安全性。
当然,在其他实施例中,若当前加载的HTML5页面不是混合应用程序的HTML5页面,也可以采用其他方式完成加载HTML5页面。譬如,可以采用如下方式完成加载第三方应用的HTML5页面:通过HTML5模块中的JS脚本向原生模块发送监听请求;在所述原生模块接收到所述监听请求后,通过所述原生模块监听所述HTML5页面是否完成页面样式的加载;若通过所述原生模块监听到所述HTML5页面完成页面样式的加载,通过所述原生模块向所述JS脚本发送完成加载反馈信息;在所述JS脚本接收到所述完成加载反馈信息后,通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。另外,对于当前加载的HTML5页面不是混合应用程序的HTML5页面的情况而言,也可以采用本申请提供的HTML5页面的加载方法。在此,不对HTML5页面为非混合应用程序的页面的情况下HTML5页面的加载方式做限制。
S120、在所述原生模块接收到所述监听请求后,通过所述原生模块监听所述HTML5页面是否完成页面样式的加载。
在本实施例中,在原生模块接收到监听请求后,将通过原生模块开始监听HTML5页面的加载情况,并判断HTML5页面是否完成页面样式的加载。
具体地,在一实施例中,如图3所示,图3为本发明实施例提供的HTML5页面的加载方法的子流程示意图。该步骤S120具体包括步骤S121至S122。
S121、通过所述原生模块监听所述网络视图组件的Document.readystate状态是否为Interactive。
S122、若所述网络视图组件的Document.readystate状态为Interactive,判定通过所述原生模块监听到所述HTML5页面完成页面样式的加载。
在网络视图组件中提供了页面加载过程的方法,分别包括开始加载页面的方法、加载中的方法、加载完成的方法以及加载失败的方法。其中,在加载完成的方法里可以获取当前网络视图组件的Document.readystate状态。该Document.readystate状态可以包括五种状态,分别为未初始化状态(uninitialized)、加载中状态(loading)、部分文件加载完成状态(loaded)、结束渲染但内嵌资源还在加载中状态(interactive)和文件完全加载完成状态(complete)。
当Document.readystate状态为interactive时,表示完成页面样式的加载。因此,在原生模块接收到监听请求后,可以通过监听所述网络视图组件的Document.readystate状态是否为Interactive来判断HTML5页面是否完成页面样式的加载。当通过原生模块监听到网络视图组件的Document.readystate状态为Interactive时,说明页面样式已经加载完,此时将判定通过所述原生模块监听到所述HTML5页面完成页面样式的加载。
当通过原生模块监听到HTML5页面完成页面样式的加载时,将执行步骤S130。
S130、若通过所述原生模块监听到所述HTML5页面完成页面样式的加载,通过所述原生模块向所述JS脚本发送完成加载反馈信息。
当通过原生模块监听到HTML5页面完成页面样式的加载时,通过原生模块向HTML5模块中的JS脚本发送完成加载反馈信息。
S140、在所述JS脚本接收到所述完成加载反馈信息后,通过所述JS脚本运行预设协议以触发预设事件。
在本实施例中,该预设事件可例如为Trigger事件。在JS脚本接收到原生模块发送的完成加载反馈信息后,将通过JS脚本运行预先设置的预设协议,以触发生成Trigger事件。其中,该预设协议为一段代码,当JS脚本运行该预设协议时,可以触发生成Trigger事件。
S150、在所述原生模块监听到所述JS脚本触发的所述预设事件后,通过所述原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中,以便于所述JS脚本基于所述交互协议与所述原生模块进行交互访问。
在本实施例中,在通过原生模块发送完该完成加载反馈信息后,将通过原生模块监听JS脚本生成的事件,并在监听到JS脚本触发的预设事件时,通过原生模块将预先存储的交互协议注入至HTML5页面的Window对象中。
其中,该交互协议包括JS脚本所需的本地方法、回调函数和HTML5调用格式等。该交互协议用于在后续JS脚本与原生模块进行复杂的交互时规范交互内容,以防止交互内容或格式出错,同时也可以提供代码的简洁性。
需要说明的是,由于步骤S110至S140中的JS脚本与原生模块的交互是非常简单的数据交互,可以采取固定的数据格式进行交互,并不需要通过交互协议来进行交互。
在一实施例中,在通过原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中之后,通过原生模块执行一段预设的JS代码,以向所述JS脚本发送完成注入反馈信息,进而使得JS脚本可以接收到所述完成注入反馈信息,并在所述JS脚本接收到所述完成注入反馈信息后,执行通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载的步骤。
S160、通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。
在本实施例中,在通过原生模块注入完交互协议后,就可以通过JS脚本加载数据逻辑以完成后续的HTML5页面的加载。
在一实施例中,在通过JS脚本加载HTML5页面的数据逻辑以完成HTML5页面的加载之后,通过该JS脚本基于Window对象中的回调函数和HTML5调用格式调用本地方法以与原生模块进行交互访问。
譬如,在步骤S160完成HTML5页面加载之后,若用户在该HTML5页面中进行点击等操作以调取摄像机、相册、通讯录等功能,此时,需要HTML5页面与原生模块进行交互访问以实现调取摄像机、相册等功能。具体地,通过JS脚本基于回调函数和HTML5调用格式来调用本地方法,进而实现与原生模块的交互,以使得HTML5页面实现调用摄像机功能、调用相册功能、调用通讯录功能等。
在本实施例中,由于需要通过JS脚本触发预设事件来触发原生模块进行交互协议的注入,同时,在交互协议的注入过程结束之后通过JS脚本进行数据逻辑的加载以完成加载HTML5页面,该加载方法可以有效地避免出现交互协议的注入时差的问题。同时,该加载方法相比于现有技术而言,对操作系统的内存以及资源的消耗也较少。
请参阅图4,图4是本发明实施例提供的一种HTML5页面的加载装置的示意性框图。如图4所示,对应于以上HTML5页面的加载方法,本发明还提供一种HTML5页面的加载装置300。该HTML5页面的加载装置300包括用于执行上述HTML5页面的加载方法的单元,该HTML5页面的加载装置300可以被配置于手机、平板电脑、台式电脑、IPAD等终端中。该终端中安装有混合应用程序。
其中,该混合应用程序包括原生模块和HTML5模块。该原生模块是指混合应用程序中用原生的系统语言编写的部分。譬如,对于IOS操作系统而言,原生模块可以采用OC语言编写。对于安卓操作系统而言,原生模块可以采用Java语言编写。该HTML5模块是指混合应用程序中包括HTML5页面的页面样式和JS(英文全称:JavaScript)脚本等组件的部分,其中,该HTML5页面的页面样式包括HTML5页面框架和CSS(英文全称:Cascading StyleSheets,中文名称:层叠样式表)元素,该HTML页面框架可以为空白的HTML页面。
具体地,请参阅图4,该HTML5页面的加载装置300包括请求发送单元301、监听单元302、信息发送单元303、触发单元304、注入单元305和加载单元306。
请求发送单元301,用于当通过所述HTML5模块调用网络视图组件以加载HTML5页面时,通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求。
在一实施例中,如图5所示,图5为本发明实施例提供的一种HTML5页面的加载装置的另一示意性框图。该HTML5页面的加载装置300还包括判断单元307。
判断单元307,用于判断所述HTML5页面是否为所述混合应用程序的HTML5页面。
该请求发送单元301,具体用于若所述HTML5页面为所述混合应用程序的HTML5页面,通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求。
该加载单元306,用于若所述HTML5页面不是所述混合应用程序的HTML5页面,加载所述HTML5页面的页面样式以及JS脚本以完成所述HTML5页面的加载。
监听单元302,用于在所述原生模块接收到所述监听请求后,通过所述原生模块监听所述HTML5页面是否完成页面样式的加载。
具体地,在一实施例中,该监听单元302具体用于通过所述原生模块监听所述网络视图组件的Document.readystate状态是否为Interactive;若所述网络视图组件的Document.readystate状态为Interactive,判定通过所述原生模块监听到所述HTML5页面完成页面样式的加载。
信息发送单元303,用于若通过所述原生模块监听到所述HTML5页面完成页面样式的加载,通过所述原生模块向所述JS脚本发送完成加载反馈信息。
触发单元304,用于在所述JS脚本接收到所述完成加载反馈信息后,通过所述JS脚本运行预设协议以触发预设事件。
在本实施例中,该预设事件可例如为Trigger事件。该预设协议为一段代码,当触发单元304通过JS脚本运行该预设协议时,可以触发生成Trigger事件。
注入单元305,用于在所述原生模块监听到所述JS脚本触发的所述预设事件后,通过所述原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中,以便于所述JS脚本基于所述交互协议与所述原生模块进行交互访问。
其中,该交互协议包括JS脚本所需的本地方法、回调函数和HTML5调用格式等。该交互协议用于在后续JS脚本与原生模块进行复杂的交互时规范交互内容,以防止交互内容或格式出错,同时也可以提供代码的简洁性。
在一实施例中,在注入单元305通过原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中之后,信息发送单元303还用于通过所述原生模块执行一段预设的JS代码,以向所述JS脚本发送完成注入反馈信息。
加载单元306,用于通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。
在一实施例中,加载单元306具体用于在所述JS脚本接收到所述完成注入反馈信息后,通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。
在一实施例中,如图6所示,图6为本发明实施例提供的一种HTML5页面的加载装置的另一示意性框图。该HTML5页面的加载装置300还包括访问单元308。该访问单元308用于通过所述JS脚本基于所述Window对象中的回调函数和HTML5调用格式调用所述本地方法以与所述原生模块进行交互访问。
需要说明的是,所属领域的技术人员可以清楚地了解到,上述HTML5页面的加载装置300和各单元的具体实现过程,可以参考前述HTML5页面的加载方法实施例中的相应描述,为了描述的方便和简洁,在此不再赘述。
在本实施例中,该HTML5页面的加载装置300在加载HTML5页面时,即可以有效地避免出现交互协议的注入时差的问题,又减少对操作系统的内存以及资源的消耗。
上述HTML5页面的加载装置可以实现为一种计算机程序的形式,该计算机程序可以在如图7所示的计算机设备上运行。
请参阅图7,图7是本申请实施例提供的一种计算机设备的示意性框图。该计算机设备500可以是终端,其中,该终端可以为手机、手提电脑、平板电脑、台式电脑等。该终端中安装有混合应用程序。该混合应用程序包括原生模块和HTML5模块。
参阅图7,该计算机设备500包括通过系统总线501连接的处理器502、存储器和网络接口505,其中,存储器可以包括非易失性存储介质503和内存储器504。
该非易失性存储介质503可存储操作系统5031和计算机程序5032。该计算机程序5032包括程序指令,该程序指令被执行时,可使得处理器502执行一种HTML5页面的加载方法。
该处理器502用于提供计算和控制能力,以支撑整个计算机设备500的运行。
该内存储器504为非易失性存储介质503中的计算机程序5032的运行提供环境,该计算机程序5032被处理器502执行时,可使得处理器502执行一种HTML5页面的加载方法。
该网络接口505用于与其它设备进行网络通信。本领域技术人员可以理解,图7中示出的结构,仅仅是与本申请方案相关的部分结构的框图,并不构成对本申请方案所应用于其上的计算机设备500的限定,具体的计算机设备500可以包括比图中所示更多或更少的部件,或者组合某些部件,或者具有不同的部件布置。
其中,所述处理器502用于运行存储在存储器中的计算机程序5032,以实现如下步骤:当通过所述HTML5模块调用网络视图组件以加载HTML5页面时,通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求;在所述原生模块接收到所述监听请求后,通过所述原生模块监听所述HTML5页面是否完成页面样式的加载;若通过所述原生模块监听到所述HTML5页面完成页面样式的加载,通过所述原生模块向所述JS脚本发送完成加载反馈信息;在所述JS脚本接收到所述完成加载反馈信息后,通过所述JS脚本运行预设协议以触发预设事件;在所述原生模块监听到所述JS脚本触发的所述预设事件后,通过所述原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中,以便于所述JS脚本基于所述交互协议与所述原生模块进行交互访问;以及通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。
在一实施例中,处理器502在实现所述通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求步骤之前,还实现如下步骤:判断所述HTML5页面是否为所述混合应用程序的HTML5页面;以及若所述HTML5页面为所述混合应用程序的HTML5页面,执行通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求的步骤。
进一步地,在一实施例中,处理器502在实现所述判断所述HTML5页面是否为所述混合应用程序的HTML5页面步骤之后,还实现如下步骤:若所述HTML5页面不是所述混合应用程序的HTML5页面,加载所述HTML5页面的页面样式以及JS脚本以完成所述HTML5页面的加载。
在一实施例中,处理器502在实现所述通过所述原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中步骤之后,还实现如下步骤:通过所述原生模块向所述JS脚本发送完成注入反馈信息;处理器502在实现所述通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载步骤时,具体实现如下步骤:在所述JS脚本接收到所述完成注入反馈信息后,通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。
在一实施例中,所述交互协议包括所述JS脚本所需的本地方法、回调函数和HTML5调用格式;处理器502在实现所述通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载步骤之后,还实现如下步骤:通过所述JS脚本基于所述Window对象中的回调函数和HTML5调用格式调用所述本地方法以与所述原生模块进行交互访问。
在一实施例中,处理器502在实现所述通过所述原生模块监听所述HTML5页面是否完成页面样式的加载步骤时,具体实现如下步骤:通过所述原生模块监听所述网络视图组件的Document.readystate状态是否为Interactive;以及若所述网络视图组件的Document.readystate状态为Interactive,判定通过所述原生模块监听到所述HTML5页面完成页面样式的加载。
在一实施例中,所述预设事件为Trigger事件。
应当理解,在本申请实施例中,处理器502可以是中央处理单元(CentralProcessing Unit,CPU),该处理器502还可以是其他通用处理器、数字信号处理器(DigitalSignal Processor,DSP)、专用集成电路(Application Specific Integrated Circuit,ASIC)、现成可编程门阵列(Field-Programmable GateArray,FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。其中,通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。
本领域普通技术人员可以理解的是实现上述HTML5页面的加载方法实施例中的全部或部分流程,是可以通过计算机程序来指令相关的硬件来完成。该计算机程序包括程序指令,计算机程序可存储于一存储介质中,该存储介质为计算机可读存储介质。该程序指令被该计算机系统中的至少一个处理器执行,以实现上述HTML5页面的加载方法的实施例的流程步骤。
因此,本发明还提供一种存储介质。该存储介质可以为计算机可读存储介质。该存储介质存储有计算机程序,其中计算机程序包括程序指令。该程序指令被处理器执行时使处理器执行如下步骤:当通过所述HTML5模块调用网络视图组件以加载HTML5页面时,通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求;在所述原生模块接收到所述监听请求后,通过所述原生模块监听所述HTML5页面是否完成页面样式的加载;若通过所述原生模块监听到所述HTML5页面完成页面样式的加载,通过所述原生模块向所述JS脚本发送完成加载反馈信息;在所述JS脚本接收到所述完成加载反馈信息后,通过所述JS脚本运行预设协议以触发预设事件;在所述原生模块监听到所述JS脚本触发的所述预设事件后,通过所述原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中,以便于所述JS脚本基于所述交互协议与所述原生模块进行交互访问;以及通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。
在一实施例中,所述处理器在执行所述程序指令而实现所述通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求步骤之前,还实现如下步骤:判断所述HTML5页面是否为所述混合应用程序的HTML5页面;以及若所述HTML5页面为所述混合应用程序的HTML5页面,执行通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求的步骤。
进一步地,在一实施例中,所述处理器在执行所述程序指令而实现所述判断所述HTML5页面是否为所述混合应用程序的HTML5页面步骤之后,还实现如下步骤:若所述HTML5页面不是所述混合应用程序的HTML5页面,加载所述HTML5页面的页面样式以及JS脚本以完成所述HTML5页面的加载。
在一实施例中,所述处理器在执行所述程序指令而实现所述通过所述原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中步骤之后,还实现如下步骤:通过所述原生模块向所述JS脚本发送完成注入反馈信息;所述处理器在执行所述程序指令而实现所述通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载步骤时,具体实现如下步骤:在所述JS脚本接收到所述完成注入反馈信息后,通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。
在一实施例中,所述交互协议包括所述JS脚本所需的本地方法、回调函数和HTML5调用格式;所述处理器在执行所述程序指令而实现所述通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载步骤之后,还实现如下步骤:通过所述JS脚本基于所述Window对象中的回调函数和HTML5调用格式调用所述本地方法以与所述原生模块进行交互访问。
在一实施例中,所述处理器在执行所述程序指令而实现所述通过所述原生模块监听所述HTML5页面是否完成页面样式的加载步骤时,具体实现如下步骤:通过所述原生模块监听所述网络视图组件的Document.readystate状态是否为Interactive;以及若所述网络视图组件的Document.readystate状态为Interactive,判定通过所述原生模块监听到所述HTML5页面完成页面样式的加载。
在一实施例中,所述预设事件为Trigger事件。
所述存储介质可以是U盘、移动硬盘、只读存储器(Read-Only Memory,ROM)、磁碟或者光盘等各种可以存储程序代码的计算机可读存储介质。
本领域普通技术人员可以意识到,结合本文中所公开的实施例描述的各示例的单元及算法步骤,能够以电子硬件、计算机软件或者二者的结合来实现,为了清楚地说明硬件和软件的可互换性,在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行,取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能,但是这种实现不应认为超出本发明的范围。
在本发明所提供的几个实施例中,应该理解到,所揭露的装置和方法,可以通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的。例如,各个单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式。例如多个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。
本发明实施例方法中的步骤可以根据实际需要进行顺序调整、合并和删减。本发明实施例装置中的单元可以根据实际需要进行合并、划分和删减。另外,在本发明各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以是两个或两个以上单元集成在一个单元中。
该集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个存储介质中。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分,或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可以是个人计算机,终端,或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。
以上所述,仅为本发明的具体实施方式,但本发明的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本发明揭露的技术范围内,可轻易想到各种等效的修改或替换,这些修改或替换都应涵盖在本发明的保护范围之内。因此,本发明的保护范围应以权利要求的保护范围为准。
Claims (10)
1.一种HTML5页面的加载方法,应用于混合应用程序中,所述混合应用程序包括原生模块和HTML5模块,其特征在于,所述方法包括:
当通过所述HTML5模块调用网络视图组件以加载HTML5页面时,通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求;
在所述原生模块接收到所述监听请求后,通过所述原生模块监听所述HTML5页面是否完成页面样式的加载;
若通过所述原生模块监听到所述HTML5页面完成页面样式的加载,通过所述原生模块向所述JS脚本发送完成加载反馈信息;
在所述JS脚本接收到所述完成加载反馈信息后,通过所述JS脚本运行预设协议以触发预设事件;
在所述原生模块监听到所述JS脚本触发的所述预设事件后,通过所述原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中,以便于所述JS脚本基于所述交互协议与所述原生模块进行交互访问;以及
通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。
2.根据权利要求1所述的HTML5页面的加载方法,其特征在于,在通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求之前,还包括:
判断所述HTML5页面是否为所述混合应用程序的HTML5页面;以及
若所述HTML5页面为所述混合应用程序的HTML5页面,执行通过所述HTML5模块中的JS脚本向所述原生模块发送监听请求的步骤。
3.根据权利要求2所述的HTML5页面的加载方法,其特征在于,在所述判断所述HTML5页面是否为所述混合应用程序的HTML5页面之后,还包括:
若所述HTML5页面不是所述混合应用程序的HTML5页面,加载所述HTML5页面的页面样式以及JS脚本以完成所述HTML5页面的加载。
4.根据权利要求1所述的HTML5页面的加载方法,其特征在于,在所述通过所述原生模块将预先存储的交互协议注入至所述HTML5页面的Window对象中之后,还包括:通过所述原生模块向所述JS脚本发送完成注入反馈信息;
所述通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载,包括:在所述JS脚本接收到所述完成注入反馈信息后,通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载。
5.根据权利要求1所述的HTML5页面的加载方法,其特征在于,所述交互协议包括所述JS脚本所需的本地方法、回调函数和HTML5调用格式;
在所述通过所述JS脚本加载所述HTML5页面的数据逻辑以完成所述HTML5页面的加载之后,还包括:通过所述JS脚本基于所述Window对象中的回调函数和HTML5调用格式调用所述本地方法以与所述原生模块进行交互访问。
6.根据权利要求1所述的HTML5页面的加载方法,其特征在于,所述通过所述原生模块监听所述HTML5页面是否完成页面样式的加载,包括:
通过所述原生模块监听所述网络视图组件的Document.readystate状态是否为Interactive;以及
若所述网络视图组件的Document.readystate状态为Interactive,判定通过所述原生模块监听到所述HTML5页面完成页面样式的加载。
7.根据权利要求1所述的HTML5页面的加载方法,其特征在于,所述预设事件为Trigger事件。
8.一种HTML5页面的加载装置,其特征在于,包括用于执行如权利要求1-7任一项所述HTML5页面的加载方法的单元。
9.一种计算机设备,其特征在于,所述计算机设备包括存储器及处理器,所述存储器上存储有计算机程序,所述处理器执行所述计算机程序时实现如权利要求1-7中任一项所述的HTML5页面的加载方法。
10.一种存储介质,其特征在于,所述存储介质存储有计算机程序,所述计算机程序包括程序指令,所述程序指令当被处理器执行时可实现如权利要求1-7中任一项所述的HTML5页面的加载方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201810949150.5A CN109271213B (zh) | 2018-08-20 | 2018-08-20 | Html5页面的加载方法、装置、计算机设备及存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201810949150.5A CN109271213B (zh) | 2018-08-20 | 2018-08-20 | Html5页面的加载方法、装置、计算机设备及存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN109271213A true CN109271213A (zh) | 2019-01-25 |
CN109271213B CN109271213B (zh) | 2023-03-28 |
Family
ID=65153690
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201810949150.5A Active CN109271213B (zh) | 2018-08-20 | 2018-08-20 | Html5页面的加载方法、装置、计算机设备及存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN109271213B (zh) |
Cited By (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN109831701A (zh) * | 2019-01-28 | 2019-05-31 | 四川长虹电器股份有限公司 | 数字电视设备浏览器以及跨页面系统事件的扩展方法 |
CN109901827A (zh) * | 2019-03-13 | 2019-06-18 | 厦门美图之家科技有限公司 | 应用交互方法、装置、电子设备及可读存储介质 |
CN109977333A (zh) * | 2019-03-22 | 2019-07-05 | 北京三快在线科技有限公司 | 网页显示方法、装置、计算机设备及存储介质 |
CN110502174A (zh) * | 2019-08-20 | 2019-11-26 | 北京字节跳动网络技术有限公司 | 一种信息显示方法、装置、电子设备及存储介质 |
CN111722935A (zh) * | 2019-03-20 | 2020-09-29 | 阿里巴巴集团控股有限公司 | 页面端与原生端的通信方法、装置、电子设备及可读介质 |
CN112099965A (zh) * | 2020-08-07 | 2020-12-18 | 咪咕文化科技有限公司 | 原生应用调用js的方法、装置、电子设备及存储介质 |
Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20100180023A1 (en) * | 2009-01-14 | 2010-07-15 | Moshe Eran Kraus | Automatic protocol detection |
US20160094615A1 (en) * | 2014-09-25 | 2016-03-31 | Oracle International Corporation | Reducing web page load latency by scheduling sets of successive outgoing http calls |
CN107729452A (zh) * | 2017-10-09 | 2018-02-23 | 武汉斗鱼网络科技有限公司 | 网页加载方法、装置、电子设备及计算机可读存储介质 |
-
2018
- 2018-08-20 CN CN201810949150.5A patent/CN109271213B/zh active Active
Patent Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20100180023A1 (en) * | 2009-01-14 | 2010-07-15 | Moshe Eran Kraus | Automatic protocol detection |
US20160094615A1 (en) * | 2014-09-25 | 2016-03-31 | Oracle International Corporation | Reducing web page load latency by scheduling sets of successive outgoing http calls |
CN107729452A (zh) * | 2017-10-09 | 2018-02-23 | 武汉斗鱼网络科技有限公司 | 网页加载方法、装置、电子设备及计算机可读存储介质 |
Non-Patent Citations (1)
Title |
---|
卢曦;汪茂;: "网页应用在移动终端中性能优化的研究" * |
Cited By (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN109831701A (zh) * | 2019-01-28 | 2019-05-31 | 四川长虹电器股份有限公司 | 数字电视设备浏览器以及跨页面系统事件的扩展方法 |
CN109831701B (zh) * | 2019-01-28 | 2021-12-21 | 四川长虹电器股份有限公司 | 数字电视设备浏览器以及跨页面系统事件的扩展方法 |
CN109901827A (zh) * | 2019-03-13 | 2019-06-18 | 厦门美图之家科技有限公司 | 应用交互方法、装置、电子设备及可读存储介质 |
CN111722935A (zh) * | 2019-03-20 | 2020-09-29 | 阿里巴巴集团控股有限公司 | 页面端与原生端的通信方法、装置、电子设备及可读介质 |
CN109977333A (zh) * | 2019-03-22 | 2019-07-05 | 北京三快在线科技有限公司 | 网页显示方法、装置、计算机设备及存储介质 |
CN110502174A (zh) * | 2019-08-20 | 2019-11-26 | 北京字节跳动网络技术有限公司 | 一种信息显示方法、装置、电子设备及存储介质 |
CN112099965A (zh) * | 2020-08-07 | 2020-12-18 | 咪咕文化科技有限公司 | 原生应用调用js的方法、装置、电子设备及存储介质 |
Also Published As
Publication number | Publication date |
---|---|
CN109271213B (zh) | 2023-03-28 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN109271213A (zh) | Html5页面的加载方法、装置、计算机设备及存储介质 | |
CN108845816A (zh) | 应用程序更新方法、系统、计算机设备及存储介质 | |
CN108307517B (zh) | 一种资源调度指示方法、网络设备及终端设备 | |
WO2017071207A1 (zh) | 一种应用安装方法、相关装置及应用安装系统 | |
CN107832350B (zh) | 一种web数据双向绑定的方法、装置、终端及存储介质 | |
CN109284458A (zh) | 网页显示方法、装置、计算机设备及存储介质 | |
CN105573748B (zh) | 快捷键定制方法以及智能终端 | |
CN103970760B (zh) | 一种网页请求处理方法及装置 | |
CN104317648B (zh) | 一种监测广告的方法和装置 | |
CN107678782B (zh) | 一种进程保护方法、装置、设备以及计算机可读存储介质 | |
CN105653934B (zh) | 移动终端及其应用保护方法 | |
CN109614099A (zh) | 自适配页面视图的开发方法、装置、计算机设备及存储介质 | |
CN109743359A (zh) | Hybrid通讯处理方法、装置、计算机设备及存储介质 | |
WO2017059727A1 (zh) | 数据自适应显示方法、终端设备及服务器 | |
CN105407407A (zh) | 视频的播放方法和装置 | |
US20240086360A1 (en) | File saving method and electronic device | |
CN109255246A (zh) | 接口参数加密方法、装置、计算机设备及存储介质 | |
CN110795353A (zh) | 快应用的调试方法、装置、设备及存储介质 | |
CN108616575A (zh) | 操作监控方法、装置、计算机设备及存储介质 | |
CN111666199B (zh) | 在智能终端上执行的调试方法以及软件调试器 | |
CN104516704B (zh) | 一种多屏系统中应用激活控制方法、装置及移动终端 | |
CN108509228B (zh) | 加载页面的方法、终端设备及计算机可读存储介质 | |
CN109491979A (zh) | 日志信息的上报方法、装置、计算机设备及存储介质 | |
CN109800044B (zh) | 一种html5双屏应用的方法、装置及电子设备 | |
CN108009084B (zh) | 一种混合移动应用的测试方法、装置及系统 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |