Html5离线包智能投放的方法、装置、设备和存储介质制造方法及图纸

技术编号:29926881 阅读:18 留言:0更新日期:2021-09-04 18:48
本发明专利技术公开了一种Html5离线包智能投放的方法、装置、设备和存储介质,针对现有的H5离线包发布的方式,因各模块大量的依赖相同的第三方库,导致相同的第三方库会重复的被下发和缓存到移动端本地,造成带宽的浪费和应用包体积过大的问题,通过公共资源包机制,将Html5离线包拆分为公共资源离线包与私有资源离线包,有效降低各H5应用的离线包体积,从而使H5应用更新率提高,H5页面开启速度加快。H5页面开启速度加快。H5页面开启速度加快。

【技术实现步骤摘要】
Html5离线包智能投放的方法、装置、设备和存储介质


[0001]本专利技术属于移动端APP管理的
,尤其涉及一种Html5离线包智能投放的方法、装置、设备和存储介质。

技术介绍

[0002]传统原生App的开发方式,功能的发布通常需要在研发完成后,提交App至应用商店,并通过审核后发布,这个过程短则1天,多则1至2周,使用者才能下载到最新的功能更新。为了能够加快发布效率,研发人员通常会在经常更新的功能上选择H5的方式来开发,透过在线发布的方式,移动端随时可以获取到最新的页面,藉以提供最新的功能。但传统BS架构的方式,移动端必须在用户进入页面时同时完成H5页面的获取,并加载到本地后渲染,用户常常需要长时间等待页面的加载,导致体验不佳,并进而产生用户的流失。为解决显著的体验问题,一种改进的做法是将H5页面打包成H5模块,在App启动时便预加载模块,App可以直接渲染本地缓存页面,不需在线获取H5页面。这种H5离线包发布的方式,因为各模块大量的依赖相同的第三方库,导致相同的第三方库会重复的被下发和缓存到移动端本地,造成带宽的浪费和App包体积过大。
[0003]为了解决公共资源重复下发导致的带宽浪费和包体积过大问题,H5发布平台一般会要求统一维护一个公共资源清单,使得相同的资源可以被提取,不再随着各模块发布。此种方案有以下几个显而易见的问题:
[0004]1、公共资源包的提取完全靠人力维护,不同的功能模块相互间并不知道有哪些共同依赖的第三方库,公共资源清单维护的横向沟通协作的成本巨大。
[0005]2、公共资源一旦被维护进资源清单后,因为无人能掌握全局的模块情况,即便某个第三方库已不再被使用,管理人员也不敢轻易将此第三方库移出公共资源清单,导致公共资源清单日渐臃肿。

技术实现思路

[0006]本专利技术的目的是提供一种Html5离线包智能投放的方法、装置、设备和存储介质,通过公共资源包机制,将资源包拆分为公共资源包与私有资源离线包,有效降低各H5应用的包体积,从而使APP更新率提高,页面开启速度加快。
[0007]为解决上述问题,本专利技术的技术方案为:
[0008]一种Html5离线包智能投放的方法,用于客户端H5应用的更新,包括:
[0009]服务端预先抽取Html5离线包中的公共资源,打包为公共资源包下发到客户端的H5应用中;
[0010]当更新H5应用时,服务端将公共资源离线包及业务相关的私有资源离线包的配置信息发布到客户端,触发客户端根据配置信息进行下载。
[0011]根据本专利技术一实施例,所述服务端预先抽取Html5离线包中的公共资源,打包为公共资源包下发到客户端的H5应用中进一步包括:
[0012]通过打包平台抽取Html5离线包中包含Vue、React通用库在内的公共资源;将抽取的公共资源进行第一次打包,并将H5应用的公共资源依赖列表记录在打包平台上;
[0013]服务端将打包后的公共资源包投放到客户端的H5应用中,触发客户端的H5应用变更配置信息,并触发第二次打包;
[0014]服务端获取当前客户端的H5应用中所有的H5配置信息及打包平台上的公共资源依赖列表,进行合并,执行第二次打包,得到经签名及压缩后的公共资源包,下发到当前客户端的H5应用中。
[0015]根据本专利技术一实施例,所述触发客户端根据配置信息进行下载之后还包括:
[0016]服务端接收客户端发送的下载Html5离线包请求,对客户端进行签名校验,验证通过后,将包括Html5离线包的下载地址、版本号及md5信息在内的配置信息发送给客户端。
[0017]根据本专利技术一实施例,所述触发客户端根据配置信息进行下载之后还包括:
[0018]客户端请求服务端获取最新Html5离线包的配置信息,根据配置信息,对需要下载的离线包,后台进行资源的下载;
[0019]对下载的资源进行md5校验,校验通过后存储至本地,并更新Html5离线包的配置状态;若校验失败,则删除资源;
[0020]打开H5页面,进行本地资源匹配,若存在,则进行本地资源的加载,或不存在,则跳转至在线地址进行资源下载。
[0021]根据本专利技术一实施例,所述客户端请求服务端获取最新Html5离线包的配置信息,根据配置信息,对需要下载的离线包,后台进行资源的下载进一步包括:
[0022]读取配置信息,并与本地原有的配置信息进行合并,增加包括是否需要下载、应用安装路径信息在内的本地字段,更新并保存配置信息;
[0023]遍历配置信息,判断H5应用是否需要下载安装,对于需要下载的应用,进行离线资源下载。
[0024]根据本专利技术一实施例,所述进行离线资源下载进一步包括:
[0025]若下载方式配置为仅WiFi,则只有在WiFi网络时,后台自动下载公共资源离线包和私有资源离线包;
[0026]若下载方式配置为所有网络都下载,则在非WiFi网络时消耗用户流量自动下载。
[0027]根据本专利技术一实施例,服务端将公共资源离线包及业务相关的私有资源离线包的配置信息发布到客户端的同时,在CDN上发布相同的线上版本,并将线上版本的在线地址与离线包一起下发到客户端。
[0028]一种Html5离线包智能投放的装置,用于客户端H5应用的更新,包括:
[0029]资源抽取模块,用于服务端预先抽取Html5离线包中的公共资源,打包为公共资源包下发到客户端的H5应用中;
[0030]资源发布模块,用于当更新H5应用时,服务端将公共资源离线包及业务相关的私有资源离线包的配置信息发布到客户端,触发客户端根据配置信息进行下载。
[0031]一种Html5离线包智能投放的设备,包括存储器和处理器,所述存储器中存储有计算机可读指令,所述处理器执行计算机可读指令时,实现本专利技术一实施例中的Html5离线包智能投放的方法。
[0032]一种计算机可读介质,存储计算机程序,所述计算机程序被一个或多个处理器执
行时,实现本专利技术一实施例中的Html5离线包智能投放的方法。
[0033]本专利技术由于采用以上技术方案,使其与现有技术相比具有以下的优点和积极效果:
[0034]1)本专利技术一实施例中的Html5离线包智能投放的方法,针对现有的H5离线包发布的方式,因各模块大量的依赖相同的第三方库,导致相同的第三方库会重复的被下发和缓存到移动端本地,造成带宽的浪费和App包体积过大的问题,通过公共资源包机制,将Html5离线包拆分为公共资源离线包与私有资源离线包,有效降低各H5应用的离线包体积,从而使H5应用更新率提高,H5页面开启速度加快。
[0035]2)本专利技术一实施例中的Html5离线包智能投放的方法,通过打包平台(如基于webpack的打包平台)提取H5应用中的公共资源并进行打包,可降低操作的复杂程度,提高公共资源的提取及打包效率。
[0036]3)本专利技术一实施例中的Html5离线包智能投放的方法,在Html5本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种Html5离线包智能投放的方法,用于客户端H5应用的更新,其特征在于,包括:服务端预先抽取Html5离线包中的公共资源,打包为公共资源包下发到客户端的H5应用中;当更新H5应用时,服务端将公共资源离线包及业务相关的私有资源离线包的配置信息发布到客户端,触发客户端根据配置信息进行下载。2.如权利要求1所述的Html5离线包智能投放的方法,其特征在于,所述服务端预先抽取Html5离线包中的公共资源,打包为公共资源包下发到客户端的H5应用中进一步包括:通过打包平台抽取Html5离线包中包含Vue、React通用库在内的公共资源;将抽取的公共资源进行第一次打包,并将H5应用的公共资源依赖列表记录在打包平台上;服务端将打包后的公共资源包投放到客户端的H5应用中,触发客户端的H5应用变更配置信息,并触发第二次打包;服务端获取当前客户端的H5应用中所有的H5配置信息及打包平台上的公共资源依赖列表,进行合并,执行第二次打包,得到经签名及压缩后的公共资源包,下发到当前客户端的H5应用中。3.如权利要求1所述的Html5离线包智能投放的方法,其特征在于,所述触发客户端根据配置信息进行下载之后还包括:服务端接收客户端发送的下载Html5离线包请求,对客户端进行签名校验,验证通过后,将包括Html5离线包的下载地址、版本号及md5信息在内的配置信息发送给客户端。4.如权利要求1所述的Html5离线包智能投放的方法,其特征在于,所述触发客户端根据配置信息进行下载之后还包括:客户端请求服务端获取最新Html5离线包的配置信息,根据配置信息,对需要下载的离线包,后台进行资源的下载;对下载的资源进行md5校验,校验通过后存储至本地,并更新Html5离线包的配置状态;若校验失败,则删除资源;打开H5页面,进行本地资源匹配,若存在,则进行本地资源的加载,或不存在,则跳转至在线地址进行资源下载。5.如权利要...

【专利技术属性】
技术研发人员:林振钦张树朋朱晓辉
申请(专利权)人:上海东普信息科技有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1