一种页面资源同时加载的方法、装置和电子设备制造方法及图纸

本申请公开了一种页面资源同时加载的方法、装置和电子设备，该方法包括：拦截页面加载请求；确定与所述页面加载请求对应的HTML文件；基于所述HTML文件，确定存储所述HTML文件的第一离线数据包；如果所述第一离线数据包存在，则基于所述HTML文件的JS/CSS请求，确定与所述JS/CSS请求对应的JS/CSS文件；基于所述JS/CSS文件，确定存储所述JS/CSS文件的第二离线数据包；如果所述第二离线数据包存在，则基于所述HTML文件和JS/CSS文件构建所述页面加载请求的HTTP响应数据。

【技术实现步骤摘要】
一种页面资源同时加载的方法、装置和电子设备
本申请涉及计算机
，尤其涉及一种页面资源同时加载的方法、装置和电子设备。
技术介绍
HybridApp(混合模式移动应用)是介于web-app、native-app之间的一种app开发模式。在HybridApp中，当多个HTML页面需要同时从离线包加载时，在目前的技术应用中，是首先基于页面加载请求判断需要加载的HTML文件内容是否在存储在本地，如果可以在本地找到，则将页面加载请求中的域名变换为对应的虚拟域，然后将该虚拟域对应的所有静态资源文件(包括HTML文件和JS/CSS文件)从本地离线包加载，而不会访问服务器。但是，仅仅通过判断HTML文件在离线包就断定对应页面的JS/CSS文件也在离线包，存在导致页面访问错误的情况。具体而言，如果HTML文件在离线包，但与该HTML文件对应需要加载的JS/CSS文件不在离线包时，JS/CSS请求的域名会被修改为一个不存在的虚拟域，之后，则会发起访问虚拟域服务器请求。由于虚拟域服务器不存在，页面访问则会出现错误。
技术实现思路
本申请实施例提供一种页面资源同时加载的方法、装置和电子设备，以实现HTML文件和JS/CSS文件基于对应的离线包进行加载，避免页面加载错误。本申请实施例采用下述技术方案：第一方面，提升了一种页面资源同时加载的方法，该方法包括：拦截页面加载请求；确定与所述页面加载请求对应的HTML文件；基于所述HTML文件，通过正则匹配确定存储所述HTML文件的第一离线数据包；如果所述第一离线数据包存在，则基于所述HTML文件的JS/CSS请求，确定与所述JS/CSS请求对应的JS/CSS文件；基于所述JS/CSS文件，确定存储所述JS/CSS文件的第二离线数据包；如果所述第二离线数据包存在，则基于所述HTML文件和JS/CSS文件构建所述页面加载请求的HTTP响应数据。第二方面，提供了一种页面资源同时加载的装置，该装置包括：拦截模块，用于拦截页面加载请求；第一确定模块，用于确定与所述页面加载请求对应的HTML文件；第二确定模块，用于基于所述HTML文件，通过正则匹配确定存储所述HTML文件的第一离线数据包；第三确定模块，用于如果所述第一离线数据包存在，则基于所述HTML文件的JS/CSS请求，确定与所述JS/CSS请求对应的JS/CSS文件；第四确定模块，用于基于所述JS/CSS文件，确定存储所述JS/CSS文件的第二离线数据包；构建模块，用于如果所述第二离线数据包存在，则基于所述HTML文件和JS/CSS文件构建所述页面加载请求的HTTP响应数据。第三方面，提供了一种电子设备，该电子设备包括：处理器；以及被安排成存储计算机可执行指令的存储器，所述可执行指令在被执行时使所述处理器执行以下操作：拦截页面加载请求；确定与所述页面加载请求对应的HTML文件；基于所述HTML文件，通过正则匹配确定存储所述HTML文件的第一离线数据包；如果所述第一离线数据包存在，则基于所述HTML文件的JS/CSS请求，确定与所述JS/CSS请求对应的JS/CSS文件；基于所述JS/CSS文件，确定存储所述JS/CSS文件的第二离线数据包；如果所述第二离线数据包存在，则基于所述HTML文件和JS/CSS文件构建所述页面加载请求的HTTP响应数据。第四方面，提供了一种计算机可读存储介质，所述计算机可读存储介质存储一个或多个程序，所述一个或多个程序当被包括多个应用程序的电子设备执行时，使得所述电子设备执行以下操作：拦截页面加载请求；确定与所述页面加载请求对应的HTML文件；基于所述HTML文件，通过正则匹配确定存储所述HTML文件的第一离线数据包；如果所述第一离线数据包存在，则基于所述HTML文件的JS/CSS请求，确定与所述JS/CSS请求对应的JS/CSS文件；基于所述JS/CSS文件，确定存储所述JS/CSS文件的第二离线数据包；如果所述第二离线数据包存在，则基于所述HTML文件和JS/CSS文件构建所述页面加载请求的HTTP响应数据。本申请实施例采用的上述至少一个技术方案能够达到以下有益效果：基于同时多个页面加载请求，可以基于对应的HTML文件，确定在本地存储对应HTML文件的第一离线数据包，如果该第一离线数据包存在，则可以基于该第一离线数据包获取对应的HTML文件；对于同时多个基于HTML文件的JS/CSS请求，可以基于与JS/CSS请求对应的JS/CSS文件，确定在本地存储对应JS/CSS文件的第二离线数据包，如果该第二离线数据包存在，则可以基于该第二离线数据包获取对应的JS/CSS文件；由此，基于第一离线数据包可以获取HTML文件，基于第二离线数据包可以获取JS/CSS文件，实现HTML文件和JS/CSS文件基于对应的离线数据包进行加载，从而在同时加载多个页面时，即使同一页面下的HTML文件和JS/CSS文件不在同一离线数据包，也不会导致页面访问出现错误。附图说明此处所说明的附图用来提供对本申请的进一步理解，构成本申请的一部分，本申请的示意性实施例及其说明用于解释本申请，并不构成对本申请的不当限定。在附图中：图1为本申请的一个实施例的页面资源同时加载的方法的示意性流程图；图2是本申请的一个实施例的电子设备的结构示意图；图3是本申请的一个实施例的页面资源同时加载的装置的结构示意图。具体实施方式为使本申请的目的、技术方案和优点更加清楚，下面将结合本申请具体实施例及相应的附图对本申请技术方案进行清楚、完整地描述。显然，所描述的实施例仅是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。以下结合附图，详细说明本申请各实施例提供的技术方案。图1为本申请的一个实施例的页面资源同时加载的方法的示意性流程图。图1所示的方法的执行主体可以但不限于手机、电脑以及其他智能终端。或者图1所示的方法的执行主体还可以是能够执行该方法的客户端本身，例如图1所示的方法由页面资源同时加载的装置执行。如图1所示，在S101处，拦截页面加载请求。基于NSURLProtocol可以拦截由NSURLConnection发起的页面加载请求。如果页面加载请求的httpMethod方法为GET方法，则拦截该页面加载请求。其中，可以通过继承NSURLProtocl并重写关键函数可以实现自定义FusionURLProtocol。之后，通过方法[NSURLProtocolregisterClass:[FusionURLProtocolclass]]注册该Protocol，使FusionURLProtocol控制对HTML页面的访问。具体而言，可以首先判断页面加载请求的httpMethod方法为是否为GET方法，如果不是GET方法，返回值为NO。之后，基于rcanInitWithRequest的请求URL，可以判断页面加载请求需要的页面资源是否可以在离线数据包中找到。canInitWithRequest是回调函数，可以通过重写NSURLProtocol的回调函数+(BOOL)canInitWithRequest:(NSURLRequest*)request实现。当c本文档来自技高网...

【技术保护点】
1.一种页面资源同时加载的方法，包括：拦截页面加载请求；确定与所述页面加载请求对应的HTML文件；基于所述HTML文件，通过正则匹配确定存储所述HTML文件的第一离线数据包；如果所述第一离线数据包存在，则基于所述HTML文件的JS/CSS请求，确定与所述JS/CSS请求对应的JS/CSS文件；基于所述JS/CSS文件，确定存储所述JS/CSS文件的第二离线数据包；如果所述第二离线数据包存在，则基于所述HTML文件和JS/CSS文件构建所述页面加载请求的HTTP响应数据。

【技术特征摘要】
1.一种页面资源同时加载的方法，包括：拦截页面加载请求；确定与所述页面加载请求对应的HTML文件；基于所述HTML文件，通过正则匹配确定存储所述HTML文件的第一离线数据包；如果所述第一离线数据包存在，则基于所述HTML文件的JS/CSS请求，确定与所述JS/CSS请求对应的JS/CSS文件；基于所述JS/CSS文件，确定存储所述JS/CSS文件的第二离线数据包；如果所述第二离线数据包存在，则基于所述HTML文件和JS/CSS文件构建所述页面加载请求的HTTP响应数据。2.根据权利要求1所述的方法，所述拦截页面加载请求，包括：如果所述页面加载请求的httpMethod方法为GET方法，则拦截所述页面加载请求。3.根据权利要求1所述的方法，所述拦截页面加载请求，包括：基于NSURLProtocol拦截由NSURLConnection发起的页面加载请求。4.根据权利要求1所述的方法，所述基于所述HTML文件，通过正则匹配确定存储所述HTML文件的第一离线数据包，包括：基于所述页面加载请求携带的URL地址或者表头信息进行正则匹配，以确定存储所述HTML文件的第一离线数据包的名称信息；基于所述第一离线数据包的名称信息确定所述第一离线数据包。5.根据权利要求4所述的方法，还包括：基于所述第一离线数据包的名称信息，从内存缓存中获取所述第一离线数据包的配置内容信息。6.根据权利要求4所述的方法，还包括：基于所述第一离线数据包的名称信息确定所述第一离线数据包的物理地址；当基于所述第一离线数据包的物理地址确定存在与所述第一离线数据包对应的本地文件时，获取在所述第一离线数据包的物理地址下所述第一离线数据包的配置内容信息。7.根据权利要求6所述的方法，还包括：当基于所述第一离线数据包的物理地址确定不存在与所述第一离线数据包对应的本地文件时，确定所述第一离线数据包的下载地址；基于所述下载地址将所述第一离线数据包下载为本地文件；获取在所述本地文件的物理地址下所述第一离线数据包的配置内容信息。8.根据权利要求6或7所述的方法，还包括：将所述第一离线数据包的名称信息和对应的配置内容信息写入内存缓存，使后续从内存缓存加载所述第一离线数据包的名称信息和对应的配置内容信息。9.根据权利要求5-7中任一项所述的方法，还包括：基于所述配置内容信息获取所述HTML文件在所述第一离线数据包中的相对路径；基于所述第一离线数据包的物理地址和所述相对路径，确定所述HTML文件的绝对路径；基于所述绝对路径从所述第一离线数据包获取所述HTML文件。10.根据权利要求9所述的方法，还包括：将从所述第一离线数据包获取的所述HTML文件写入内存缓存，使后续从内存缓存加载所述HTML文件。11.根据权利要...

【专利技术属性】
技术研发人员：杨成旭，
申请(专利权)人：阿里巴巴集团控股有限公司，
类型：发明
国别省市：开曼群岛,KY