图片加载方法、装置、电子设备及存储介质.pdf

上传人:bo****18 文档编号:9301456 上传时间:2021-05-12 格式:PDF 页数:19 大小:624.47KB
收藏 版权申诉 举报 下载
图片加载方法、装置、电子设备及存储介质.pdf_第1页
第1页 / 共19页
图片加载方法、装置、电子设备及存储介质.pdf_第2页
第2页 / 共19页
图片加载方法、装置、电子设备及存储介质.pdf_第3页
第3页 / 共19页
文档描述:

《图片加载方法、装置、电子设备及存储介质.pdf》由会员分享,可在线阅读,更多相关《图片加载方法、装置、电子设备及存储介质.pdf(19页完成版)》请在专利查询网上搜索。

1、(19)中华人民共和国国家知识产权局 (12)发明专利申请 (10)申请公布号 (43)申请公布日 (21)申请号 202010043718.4 (22)申请日 2020.01.15 (71)申请人 北京达佳互联信息技术有限公司 地址 100085 北京市海淀区上地西路6号1 幢1层101D1-7 (72)发明人 陈泓硕 (74)专利代理机构 北京润泽恒知识产权代理有 限公司 11319 代理人 李娜 (51)Int.Cl. G06F 16/957(2019.01) (54)发明名称 一种图片加载方法、 装置、 电子设备及存储 介质 (57)摘要 本公开关于一种图片加载方法、 装置、 电子 设。

2、备及存储介质, 该方法包括: 在检测到目标浏 览器需要加载目标图片时, 获取目标图片的图片 格式; 在判定目标浏览器不支持图片格式时, 获 取目标图片的预设类型的图片编码格式, 其中, 目标浏览器支持预设类型的图片编码格式; 将目 标图片的统一资源定位符url替换为图片编码格 式; 通过目标浏览器加载目标图片, 并展示目标 图片。 可见, 通过本公开实施例提供的技术方案, 在检测到目标浏览器不支持目标图片的图片格 式, 可以将目标图片的url替换为目标图片的预 设类型的图片编码格式, 由于目标浏览器支持预 设类型的图片编码格式, 因此, 可以通过目标浏 览器加载目标图片, 并展示目标图片。 权。

3、利要求书2页 说明书11页 附图5页 CN 111259289 A 2020.06.09 CN 111259289 A 1.一种图片加载方法, 其特征在于, 包括: 在检测到目标浏览器需要加载目标图片时, 获取所述目标图片的图片格式; 在判定所述目标浏览器不支持所述图片格式时, 获取所述目标图片的预设类型的图片 编码格式, 其中, 所述目标浏览器支持所述预设类型的图片编码格式; 将所述目标图片的统一资源定位符url替换为所述图片编码格式; 通过所述目标浏览器加载所述目标图片, 并展示所述目标图片。 2.根据权利要求1所述的方法, 其特征在于, 所述目标图片的图片格式为webp格式, 所 述预设。

4、类型的图片编码格式为base64。 3.根据权利要求2所述的方法, 其特征在于, 在所述获取所述目标图片的预设类型的图 片编码格式之前, 所述方法还包括: 通过懒加载方式将所述目标图片预先加载到所述目标浏览器缓存中; 启动所述目标浏览器中的目标异步线程; 通过所述目标异步线程调用预设webpJS, 将所述目标浏览器缓存中的所述目标图片转 换为base64; 将所述base64存储于所述目标浏览器缓存中。 4.根据权利要求3所述的方法, 其特征在于, 所述获取所述目标图片的预设类型的编码 格式, 包括: 从所述目标浏览器缓存中获取所述base64。 5.根据权利要求3或4所述的方法, 其特征在于。

5、, 在通过所述目标浏览器加载所述目标 图片, 并展示所述目标图片之后, 还包括: 删除目标浏览器缓存中的所述目标图片, 以及所述base64。 6.一种图片加载装置, 其特征在于, 包括: 图片格式获取模块, 被配置为执行在检测到目标浏览器需要加载目标图片时, 获取所 述目标图片的图片格式; 图片编码格式获取模块, 被配置为执行在判定所述目标浏览器不支持所述图片格式 时, 获取所述目标图片的预设类型的图片编码格式, 其中, 所述目标浏览器支持所述预设类 型的图片编码格式; 统一资源定位符替换模块, 被配置为执行将所述目标图片的统一资源定位符url替换 为所述图片编码格式; 图片加载模块, 被配。

6、置为执行通过所述目标浏览器加载所述目标图片, 并展示所述目 标图片。 7.根据权利要求6所述的装置, 其特征在于, 所述目标图片的图片格式为webp格式, 所 述预设类型的图片编码格式为base64。 8.根据权利要求7所述的装置, 其特征在于, 所述装置还包括: 图片预加载模块, 被配置为执行在所述图片编码格式模块获取所述目标图片的预设类 型的图片编码格式之前, 通过懒加载方式将所述目标图片预先加载到所述目标浏览器缓存 中; 线程启动模块, 被配置为执行启动所述目标浏览器中的目标异步线程; 图片转化模块, 被配置为执行通过所述目标异步线程调用预设webpJS, 将所述目标浏 权利要求书 1/。

7、2 页 2 CN 111259289 A 2 览器缓存中的所述目标图片转换为base64; base64存储模块, 被配置为执行将所述base64存储于所述目标浏览器缓存中。 9.一种电子设备, 其特征在于, 包括: 处理器; 用于存储所述处理器可执行指令的存储器; 其中, 所述处理器被配置为执行所述指令, 以实现如权利要求1至5中任一项所述的图 片加载方法。 10.一种存储介质, 当所述存储介质中的指令由电子设备的处理器执行时, 使得所述电 子设备能够执行如权利要求1至5中任一项所述的图片加载方法。 权利要求书 2/2 页 3 CN 111259289 A 3 一种图片加载方法、 装置、 电。

8、子设备及存储介质 技术领域 0001 本申请涉及图片处理技术领域, 特别是涉及一种图片加载方法、 装置、 电子设备及 存储介质。 背景技术 0002 WebP是一种同时提供了有损压缩与无损压缩(可逆压缩)的图片文件格式。 对于两 张相同大小的WebP格式的图片和JPG格式的图片, WebP格式的图片比JPG格式的图片更加清 晰。 0003 但是, 相关技术中, 有些浏览器如IE浏览器不支持WebP格式的图片, 因此, 不支持 WebP格式的图片的浏览器无法成功加载WebP格式的图片。 发明内容 0004 为了解决相关技术中存在的因浏览器不支持WebP格式的图片, 而导致浏览器无法 成功加载We。

9、bP格式的图片的问题。 本公开提供一种图片加载方法、 装置、 电子设备及存储介 质, 本公开的技术方案如下: 0005 根据本公开实施例的第一方面, 提供了一种图片加载方法, 包括: 0006 在检测到目标浏览器需要加载目标图片时, 获取所述目标图片的图片格式; 0007 在判定所述目标浏览器不支持所述图片格式时, 获取所述目标图片的预设类型的 图片编码格式, 其中, 所述目标浏览器支持所述预设类型的图片编码格式; 0008 将所述目标图片的统一资源定位符url替换为所述图片编码格式; 0009 通过所述目标浏览器加载所述目标图片, 并展示所述目标图片。 0010 可选的, 所述目标图片的图片。

10、格式为webp格式, 所述预设类型的图片编码格式为 base64。 0011 可选的, 在所述获取所述目标图片的预设类型的图片编码格式之前, 所述方法还 包括: 0012 通过懒加载方式将所述目标图片预先加载到所述目标浏览器缓存中; 0013 启动所述目标浏览器中的目标异步线程; 0014 通过所述目标异步线程调用预设webpJS, 将所述目标浏览器缓存中的所述目标图 片转换为base64; 0015 将所述base64存储于所述目标浏览器缓存中。 0016 可选的, 所述获取所述目标图片的预设类型的编码格式, 包括: 0017 从所述目标浏览器缓存中获取所述base64。 0018 可选的,。

11、 在通过所述目标浏览器加载所述目标图片, 并展示所述目标图片之后, 还 包括: 0019 删除目标浏览器缓存中的所述目标图片, 以及所述base64。 0020 根据本公开实施例的第二方面, 提供了一种图片加载装置, 包括: 说明书 1/11 页 4 CN 111259289 A 4 0021 图片格式获取模块, 被配置为执行在检测到目标浏览器需要加载目标图片时, 获 取所述目标图片的图片格式; 0022 图片编码格式获取模块, 被配置为执行在判定所述目标浏览器不支持所述图片格 式时, 获取所述目标图片的预设类型的图片编码格式, 其中, 所述目标浏览器支持所述预设 类型的图片编码格式; 002。

12、3 统一资源定位符替换模块, 被配置为执行将所述目标图片的统一资源定位符url 替换为所述图片编码格式; 0024 图片加载模块, 被配置为执行通过所述目标浏览器加载所述目标图片, 并展示所 述目标图片。 0025 可选的, 所述目标图片的图片格式为webp格式, 所述预设类型的图片编码格式为 base64。 0026 可选的, 所述装置还包括: 0027 图片预加载模块, 被配置为执行在所述图片编码格式模块获取所述目标图片的预 设类型的图片编码格式之前, 通过懒加载方式将所述目标图片预先加载到所述目标浏览器 缓存中; 0028 线程启动模块, 被配置为执行启动所述目标浏览器中的目标异步线程;。

13、 0029 图片转化模块, 被配置为执行通过所述目标异步线程调用预设webpJS, 将所述目 标浏览器缓存中的所述目标图片转换为base64; 0030 base64存储模块, 被配置为执行将所述base64存储于所述目标浏览器缓存中。 0031 可选的, 所述图片编码格式获取模块, 被配置为执行: 0032 从所述目标浏览器缓存中获取所述base64。 0033 可选的, 还包括: 0034 删除模块, 被配置为执行在通过所述目标浏览器加载所述目标图片, 并展示所述 目标图片之后, 删除目标浏览器缓存中的所述目标图片, 以及所述base64。 0035 根据本公开实施例的第三方面, 提供了一。

14、种电子设备, 包括: 0036 处理器; 0037 用于存储所述处理器可执行指令的存储器; 0038 其中, 所述处理器被配置为执行所述指令, 以实现第一方面所述的图片加载方法。 0039 根据本公开实施例的第四方面, 提供了一种存储介质, 当所述存储介质中的指令 由电子设备的处理器执行时, 使得所述电子设备能够执行第一方面所述的图片加载方法。 0040 本公开实施例提供的技术方案, 在检测到目标浏览器需要加载目标图片时, 获取 目标图片的图片格式; 在判定目标浏览器不支持图片格式时, 获取目标图片的预设类型的 图片编码格式, 其中, 目标浏览器支持预设类型的图片编码格式; 将目标图片的统一资。

15、源定 位符url替换为图片编码格式; 通过目标浏览器加载目标图片, 并展示目标图片。 0041 可见, 通过本公开实施例提供的技术方案, 在检测到目标浏览器不支持目标图片 的图片格式, 可以将目标图片的url替换为目标图片的预设类型的图片编码格式, 由于目标 浏览器支持预设类型的图片编码格式, 因此, 可以通过目标浏览器加载目标图片, 并展示目 标图片, 这样, 就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片, 即 能够成功加载目标图片, 并正常显示webp格式的图片。 说明书 2/11 页 5 CN 111259289 A 5 附图说明 0042 图1是根据一示例性实。

16、施例示出的一种图片加载方法的流程图; 0043 图2是根据一示例性实施例示出的另一种图片加载方法的流程图; 0044 图3是根据一示例性实施例示出的一种图片加载装置的框图; 0045 图4是根据一示例性实施例示出的一种电子设备的框图; 0046 图5是根据一示例性实施例示出的一种图片加载装置的框图; 0047 图6是根据一示例性实施例示出的另一种图片加载装置的框图。 具体实施方式 0048 为了使本领域普通人员更好地理解本公开的技术方案, 下面将结合附图, 对本公 开实施例中的技术方案进行清楚、 完整地描述。 0049 需要说明的是, 本公开的说明书和权利要求书及上述附图中的术语 “第一” 、。

17、“第 二” 等是用于区别类似的对象, 而不必用于描述特定的顺序或先后次序。 应该理解这样使用 的数据在适当情况下可以互换, 以便这里描述的本公开的实施例能够以除了在这里图示或 描述的那些以外的顺序实施。 以下示例性实施例中所描述的实施方式并不代表与本公开相 一致的所有实施方式。 相反, 它们仅是与如所附权利要求书中所详述的、 本公开的一些方面 相一致的装置和方法的例子。 0050 WebP是一种同时提供了有损压缩与无损压缩(可逆压缩)的图片文件格式。 对于两 张相同大小的WebP格式的图片和JPG格式的图片, WebP格式的图片比JPG格式的图片更加清 晰。 0051 但是, 相关技术中, 有。

18、些浏览器如IE浏览器不支持WebP格式的图片, 因此, 不支持 WebP格式的图片的浏览器无法成功加载WebP格式的图片。 0052 为了解决相关技术中存在的因浏览器不支持WebP格式的图片, 而导致浏览器无法 成功加载WebP格式的图片的问题。 本公开实施例提供了一种图片加载方法、 装置、 电子设备 及存储介质。 0053 第一方面, 首先对本公开实施例提供的一种图片加载方法进行详细介绍。 0054 需要说明的是, 本公开实施例提供的一种图片加载方法的执行主体为一种图片加 载装置, 该图片加载装置运行于电子设备中, 该电子设备可以是终端或者服务器, 本公开实 施例对电子设备不做具体限定。 0。

19、055 图1是根据一示例性实施例示出的一种图片加载方法的流程图。 如图1所示, 该方 法可以包括以下步骤。 0056 在步骤S11中, 在检测到目标浏览器需要加载目标图片时, 获取目标图片的图片格 式。 0057 其中, 目标浏览器可以为作为执行主体的电子设备中的任一浏览器。 目标图片可 以为目标浏览器需要加载的任一图片, 且目标图片可以为css(Cascading Style Sheets, 层叠样式表)。 0058 具体的, 当用户需要通过目标浏览器访问网页时, 用户可以向作为执行主体的电 子设备发送网页访问指令, 此时, 作为执行主体的电子设备可以接收到网页访问指令。 并 且, 作为执行。

20、主体的电子设备可以检测要访问的网页是否包括图片, 在检测到要访问的网 说明书 3/11 页 6 CN 111259289 A 6 页中包括图片时, 即检测到目标浏览器需要加载目标图片, 该目标图片为要访问的网页中 包括的任一图片, 此时, 作为执行主体的电子设备可以获取目标图片的图片格式。 0059 其中, 目标图片的图片格式可以为: jpg格式, gif格式, bmp格式, tif格式, webp格 式等。 可以理解的是, 目标图片的图片格式可以根据实际情况确定, 本公开实施例对目标图 片的图片格式不做具体限定。 0060 在步骤S12中, 在判定目标浏览器不支持图片格式时, 获取目标图片的。

21、预设类型的 图片编码格式。 0061 其中, 目标浏览器支持预设类型的图片编码格式。 0062 为了防止后续步骤中因目标浏览器不支持目标图片的图片格式, 而导致目标浏览 器无法成功加载目标图片。 作为执行主体的电子设备获取到目标图片的图片格式之后, 可 以判断目标浏览器是否支持目标图片的图片格式。 0063 例如, 假设目标图片的图片格式为webp格式, 目标浏览器为IE浏览器, 由于IE浏览 器不支持webp格式, 此时, 可以判定目标浏览器不支持目标图片的图片格式。 0064 再例如, 假设目标图片的图片格式为webp格式, 目标浏览器为火狐浏览器, 由于火 狐浏览器支持webp格式, 此。

22、时, 可以判定目标浏览器支持目标图片的图片格式。 0065 如果作为执行主体的电子设备判定目标浏览器不支持目标图片的图片格式, 可以 获取目标图片的预设类型的图片编码格式, 并且, 目标浏览器支持预设类型的图片编码格 式, 这样, 有助于后续步骤中成功加载目标图片。 0066 在一种实施方式中, 目标图片的图片格式为webp格式, 预设类型的图片编码格式 为base64。 其中, base64是一种图片编码格式, 是一种基于64个可打印字符来表示二进制数 据的方法。 当然, 预设类型可以是目标浏览器支持的任意一种图片编码格式, 本公开实施例 对预设类型的图片编码格式不做具体限定。 0067 并。

23、且, 获取目标图片的预设类型的图片编码格式的方式可以有多种。 0068 在一种实施方式中, 作为执行主体的电子设备可以启动异步线程, 通过异步线程 用预设webpJS目标图片转化为预设类型的图片编码格式。 并且, 由于将目标图片转化为预 设类型的图片编码格式的过程是在目标异步线程中进行的, 因此, 不会造成线程阻塞, 从而 节省了作为执行主体的电子设备的性能, 从而提升了用户体验。 0069 在另一种实施方式中, 作为执行主体的电子设备可以直接从浏览器缓存中获取目 标图片的预设类型的图片编码格式, 为了方案描述清楚, 将在图2实施例中进行详细阐述。 0070 在步骤S13中, 将目标图片的统一。

24、资源定位符url替换为图片编码格式。 0071 作为执行主体的电子设备获取目标图片的预设类型的图片编码格式后, 在加载目 标图片时, 可以将目标图片的统一资源定位符url替换为预设类型的图片编码格式。 0072 具体的, 当预设类型的图片编码格式为base64时, 可以将目标图片的url替换为 base64, 这样, 有利于后续步骤中, 目标浏览器能够成功加载目标图片。 0073 在步骤S14中, 通过目标浏览器加载目标图片, 并展示目标图片。 0074 在将目标图片的url替换为预设类型的图片编码格式后, 由于目标浏览器支持预 设类型的图片编码格式, 因此, 可以通过目标浏览器加载目标图片,。

25、 并展示目标图片, 这样, 就可以让原本不支持webp格式的图片的浏览器能够成功加载目标图片, 从而能够正常显示 webp格式的图片。 说明书 4/11 页 7 CN 111259289 A 7 0075 本公开实施例提供的技术方案, 在检测到目标浏览器需要加载目标图片时, 获取 目标图片的图片格式; 在判定目标浏览器不支持图片格式时, 获取目标图片的预设类型的 图片编码格式, 其中, 目标浏览器支持预设类型的图片编码格式; 将目标图片的统一资源定 位符url替换为图片编码格式; 通过目标浏览器加载目标图片, 并展示目标图片。 0076 可见, 通过本公开实施例提供的技术方案, 在检测到目标浏。

26、览器不支持目标图片 的图片格式, 可以将目标图片的url替换为目标图片的预设类型的图片编码格式, 由于目标 浏览器支持预设类型的图片编码格式, 因此, 可以通过目标浏览器加载目标图片, 并展示目 标图片, 这样, 就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片, 即 能够成功加载目标图片, 并正常显示webp格式的图片。 0077 图2是根据一示例性实施例示出的一种图片加载方法的流程图。 如图2所示, 该方 法可以包括以下步骤。 0078 在步骤S21中, 在检测到目标浏览器需要加载目标图片时, 获取目标图片的图片格 式。 0079 其中, 目标浏览器可以为作为执行主体。

27、的电子设备中的任一浏览器。 目标图片可 以为目标浏览器需要加载的任一图片。 0080 具体的, 当用户需要通过目标浏览器访问网页时, 用户可以向作为执行主体的电 子设备发送网页访问指令, 此时, 作为执行主体的电子设备可以接收到网页访问指令。 并 且, 作为执行主体的电子设备可以检测要访问的网页是否包括图片, 在检测到要访问的网 页中包括图片时, 即检测到目标浏览器需要加载目标图片, 该目标图片为要访问的网页中 包括的任一图片, 此时, 作为执行主体的电子设备可以获取目标图片的图片格式。 0081 其中, 目标图片的图片格式可以为: jpg格式, gif格式, bmp格式, tif格式, we。

28、bp格 式等。 可以理解的是, 目标图片的图片格式可以根据实际情况确定, 本公开实施例对目标图 片的图片格式不做具体限定。 0082 在步骤S22中, 通过懒加载方式将目标图片预先加载到目标浏览器缓存中。 0083 可以理解的是, 懒加载是一种独特而又强大的数据获取方法,它能够在用户滚动 页面的时候自动获取更多的数据,而新得到的数据不会影响原有数据的显示,同时最大程 度上减少服务器端的资源耗用。 0084 因此, 作为执行主体的电子设备可以通过懒加载的方式将目标图片预先加载的目 标浏览器的缓存中。 0085 在步骤S23中, 启动目标浏览器中的目标异步线程。 0086 具体的, 作为执行主体的。

29、电子设备在将目标图片预先加载到目标浏览器缓存中之 后, 可以启动目标浏览器的目标异步线程, 以在后续步骤中, 在目标异步线程中将目标图片 转化为base64。 0087 在步骤S24中, 通过目标异步线程调用预设webpJS库, 将目标浏览器缓存中的目标 图片转换为base64。 0088 作为执行主体的电子设备启动目标异步线程之后, 可以调用预设webpJS将目标浏 览器中缓存的目标图片转化为base64。 并且, 由于将目标浏览器中缓存的目标图片转化为 base64的过程是在目标异步线程中进行的, 因此, 不会造成线程阻塞, 从而节省了作为执行 主体的电子设备的性能, 从而提升了用户体验。。

30、 说明书 5/11 页 8 CN 111259289 A 8 0089 在步骤S25中, 将base64存储于目标浏览器缓存中。 0090 作为执行主体的电子设备将目标图片转化为base64之后, 可以将目标图片的 base64存储于目标浏览器缓存中, 这样, 后续步骤中, 在作为执行主体的电子设备判定目标 浏览器不支持图片格式时, 可以从目标浏览器缓存中获取直接获取目标图片的base64, 从 而提高了获取目标图片的base64的效率。 0091 在步骤S26中, 在判定目标浏览器不支持图片格式时, 从目标浏览器缓存中获取 base64。 0092 由于目标浏览器缓存中存储有目标图片的bas。

31、e64, 因此, 作为执行主体的电子设 备判定目标浏览器不支持目标图片的图片格式时, 可以直接从目标浏览器缓存中获取 base64, 提高了获取目标图片的base64的效率。 0093 在步骤S27中, 将目标图片的统一资源定位符url替换为base64。 0094 作为执行主体的电子设备获取目标图片的base64后, 在加载目标图片时, 可以将 目标图片的统一资源定位符url替换为base64。 有利于后续步骤中, 目标浏览器能够成功加 载目标图片。 0095 在步骤S28中, 通过目标浏览器加载目标图片, 并展示目标图片。 0096 在将目标图片的url替换为base64后, 由于目标浏览。

32、器支持base64, 因此, 可以通 过目标浏览器加载目标图片, 并展示目标图片, 这样, 就可以让原本不支持webp格式的图片 的浏览器能够成功加载目标图片, 从而能够正常显示webp格式的图片。 0097 可见, 通过本公开实施例提供的技术方案, 在检测到目标浏览器不支持目标图片 的图片格式, 可以直接从目标浏览器缓存中获取目标图片的base64, 并可以将目标图片的 url替换为目标图片的base64, 由于目标浏览器支持base64, 因此, 可以通过目标浏览器加 载目标图片, 并展示目标图片, 这样, 就可以让原本不支持webp格式的图片的浏览器能够兼 容webp格式的图片, 即能够。

33、成功加载目标图片, 并正常显示webp格式的图片。 0098 在图2所示实施例的基础上, 在一种实施方式中, 在通过目标浏览器加载目标图 片, 并展示目标图片之后, 图片加载方法还可以包括: 0099 删除目标浏览器缓存中的目标图片, 以及目标图片的base64。 0100 在该实施方式中, 作为执行主体的电子设备通过目标浏览器加载目标图片, 并展 示图片之后, 即表明目标浏览器已经成功加载了目标图片, 此时, 可以将目标浏览器中缓存 的目标图片以及目标图片的base64删除, 以达到节省目标浏览器缓存的效果。 0101 可见, 通过本公开实施例提供的技术方案, 在通过目标浏览器加载目标图片,。

34、 并展 示目标图片之后, 删除目标浏览器缓存中的目标图片, 以及目标图片的base64, 从而达到节 省目标浏览器缓存的效果。 0102 根据本公开实施例的第二方面, 提供了一种图片加载装置, 如图3所示, 包括: 0103 图片格式获取模块310, 被配置为执行在检测到目标浏览器需要加载目标图片时, 获取所述目标图片的图片格式。 0104 图片编码格式获取模块320, 被配置为执行在判定所述目标浏览器不支持所述图 片格式时, 获取所述目标图片的预设类型的图片编码格式, 其中, 所述目标浏览器支持所述 预设类型的图片编码格式。 0105 在一种可选的实施方式中, 所述目标图片的图片格式为web。

35、p格式, 所述预设类型 说明书 6/11 页 9 CN 111259289 A 9 的图片编码格式为base64。 0106 统一资源定位符替换模块330, 被配置为执行将所述目标图片的统一资源定位符 url替换为所述图片编码格式。 0107 图片加载模块340, 被配置为执行通过所述目标浏览器加载所述目标图片, 并展示 所述目标图片。 0108 本公开实施例提供的技术方案, 在检测到目标浏览器需要加载目标图片时, 获取 目标图片的图片格式; 在判定目标浏览器不支持图片格式时, 获取目标图片的预设类型的 图片编码格式, 其中, 目标浏览器支持预设类型的图片编码格式; 将目标图片的统一资源定 位。

36、符url替换为图片编码格式; 通过目标浏览器加载目标图片, 并展示目标图片。 0109 可见, 通过本公开实施例提供的技术方案, 在检测到目标浏览器不支持目标图片 的图片格式, 可以将目标图片的url替换为目标图片的预设类型的图片编码格式, 由于目标 浏览器支持预设类型的图片编码格式, 因此, 可以通过目标浏览器加载目标图片, 并展示目 标图片, 这样, 就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片, 即 能够成功加载目标图片, 并正常显示webp格式的图片。 0110 在一种可选的实施方式中, 所述装置还包括: 0111 图片预加载模块, 被配置为执行在所述图片编码。

37、格式模块获取所述目标图片的预 设类型的图片编码格式之前, 通过懒加载方式将所述目标图片预先加载到所述目标浏览器 缓存中; 0112 线程启动模块, 被配置为执行启动所述目标浏览器中的目标异步线程; 0113 图片转化模块, 被配置为执行通过所述目标异步线程调用预设webpJS, 将所述目 标浏览器缓存中的所述目标图片转换为base64; 0114 base64存储模块, 被配置为执行将所述base64存储于所述目标浏览器缓存中。 0115 可见, 通过本公开实施例提供的技术方案, 在检测到目标浏览器不支持目标图片 的图片格式, 可以直接从目标浏览器缓存中获取目标图片的base64, 并可以将目。

38、标图片的 url替换为目标图片的base64, 由于目标浏览器支持base64, 因此, 可以通过目标浏览器加 载目标图片, 并展示目标图片, 这样, 就可以让原本不支持webp格式的图片的浏览器能够兼 容webp格式的图片, 即能够成功加载目标图片, 并正常显示webp格式的图片。 0116 在一种可选的实施方式中, 所述图片编码格式获取模块, 被配置为执行: 0117 从所述目标浏览器缓存中获取所述base64。 0118 在一种可选的实施方式中, 所述装置还包括: 0119 删除模块, 被配置为执行在通过所述目标浏览器加载所述目标图片, 并展示所述 目标图片之后, 删除目标浏览器缓存中的。

39、所述目标图片, 以及所述base64。 0120 可见, 通过本公开实施例提供的技术方案, 在通过目标浏览器加载目标图片, 并展 示目标图片之后, 删除目标浏览器缓存中的目标图片, 以及目标图片的base64, 从而达到节 省目标浏览器缓存的效果。 0121 根据本公开实施例的第三方面, 提供了一种电子设备。 图4是根据一示例性实施例 示出的一种电子设备框图。 参照图4, 该电子设备包括: 0122 处理器410; 0123 用于存储所述处理器可执行指令的存储器420; 说明书 7/11 页 10 CN 111259289 A 10 0124 其中, 所述处理器被配置为执行所述指令, 以实现本。

40、公开所提供的图片加载方法。 0125 本公开实施例提供的技术方案, 在检测到目标浏览器需要加载目标图片时, 获取 目标图片的图片格式; 在判定目标浏览器不支持图片格式时, 获取目标图片的预设类型的 图片编码格式, 其中, 目标浏览器支持预设类型的图片编码格式; 将目标图片的统一资源定 位符url替换为图片编码格式; 通过目标浏览器加载目标图片, 并展示目标图片。 0126 可见, 通过本公开实施例提供的技术方案, 在检测到目标浏览器不支持目标图片 的图片格式, 可以将目标图片的url替换为目标图片的预设类型的图片编码格式, 由于目标 浏览器支持预设类型的图片编码格式, 因此, 可以通过目标浏览。

41、器加载目标图片, 并展示目 标图片, 这样, 就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片, 即 能够成功加载目标图片, 并正常显示webp格式的图片。 0127 图5是根据一示例性实施例示出的一种图片加载装置500的框图。 例如, 装置500可 以是移动电话, 计算机, 数字广播电子设备, 消息收发设备, 游戏控制台, 平板设备, 医疗设 备, 健身设备, 个人数字助理等。 0128 参照图5, 装置500可以包括以下一个或多个组件: 处理组件502, 存储器504, 电力 组件506, 多媒体组件508, 音频组件510, 输入/输出(I/O)的接口512, 传感。

42、器组件514, 以及 通信组件516。 0129 处理组件502通常控制装置500的整体操作, 诸如与显示, 电话呼叫, 数据通信, 相 机操作和记录操作相关联的操作。 处理组件502可以包括一个或多个处理器520来执行指 令, 以完成上述的图片加载方法的全部或部分步骤。 此外, 处理组件502可以包括一个或多 个模块, 便于处理组件502和其他组件之间的交互。 例如, 处理组件502可以包括多媒体模 块, 以方便多媒体组件508和处理组件502之间的交互。 0130 存储器504被配置为存储各种类型的数据以支持在设备500的操作。 这些数据的示 例包括用于在装置500上操作的任何应用程序或方。

43、法的指令, 联系人数据, 电话簿数据, 消 息, 图片, 视频等。 存储器504可以由任何类型的易失性或非易失性存储设备或者它们的组 合实现, 如静态随机存取存储器(SRAM), 电可擦除可编程只读存储器(EEPROM), 可擦除可编 程只读存储器(EPROM), 可编程只读存储器(PROM), 只读存储器(ROM), 磁存储器, 快闪存储 器, 磁盘或光盘。 0131 电源组件506为装置500的各种组件提供电力。 电源组件506可以包括电源管理系 统, 一个或多个电源, 及其他与为装置500生成、 管理和分配电力相关联的组件。 0132 多媒体组件508包括在所述装置500和用户之间的提供。

44、一个输出接口的屏幕。 在一 些实施例中, 屏幕可以包括液晶显示器(LCD)和触摸面板(TP)。 如果屏幕包括触摸面板, 屏 幕可以被实现为触摸屏, 以接收来自用户的输入信号。 触摸面板包括一个或多个触摸传感 器以感测触摸、 滑动和触摸面板上的手势。 所述触摸传感器可以不仅感测触摸或滑动动作 的边界, 而且还检测与所述触摸或滑动操作相关的持续时间和压力。 在一些实施例中, 多媒 体组件508包括一个前置摄像头和/或后置摄像头。 当设备500处于操作模式, 如拍摄模式或 视频模式时, 前置摄像头和/或后置摄像头可以接收外部的多媒体数据。 每个前置摄像头和 后置摄像头可以是一个固定的光学透镜系统或具。

45、有焦距和光学变焦能力。 0133 音频组件510被配置为输出和/或输入音频信号。 例如, 音频组件510包括一个麦克 风(MIC), 当装置500处于操作模式, 如呼叫模式、 记录模式和语音识别模式时, 麦克风被配 说明书 8/11 页 11 CN 111259289 A 11 置为接收外部音频信号。 所接收的音频信号可以被进一步存储在存储器404或经由通信组 件516发送。 在一些实施例中, 音频组件510还包括一个扬声器, 用于输出音频信号。 0134 I/O接口512为处理组件502和外围接口模块之间提供接口, 上述外围接口模块可 以是键盘, 点击轮, 按钮等。 这些按钮可包括但不限于:。

46、 主页按钮、 音量按钮、 启动按钮和锁 定按钮。 0135 传感器组件514包括一个或多个传感器, 用于为装置500提供各个方面的状态评 估。 例如, 传感器组件514可以检测到设备500的打开/关闭状态, 组件的相对定位, 例如所述 组件为装置500的显示器和小键盘, 传感器组件514还可以检测装置500或装置500一个组件 的位置改变, 用户与装置500接触的存在或不存在, 装置500方位或加速/减速和装置500的 温度变化。 传感器组件514可以包括接近传感器, 被配置用来在没有任何的物理接触时检测 附近物体的存在。 传感器组件514还可以包括光传感器, 如CMOS或CCD图像传感器, 。

47、用于在成 像应用中使用。 在一些实施例中, 该传感器组件514还可以包括加速度传感器, 陀螺仪传感 器, 磁传感器, 压力传感器或温度传感器。 0136 通信组件516被配置为便于装置500和其他设备之间有线或无线方式的通信。 装置 500可以接入基于通信标准的无线网络, 如WiFi, 运营商网络(如2G、 3G、 4G或5G), 或它们的 组合。 在一个示例性实施例中, 通信组件416经由广播信道接收来自外部广播管理系统的广 播信号或广播相关信息。 在一个示例性实施例中, 所述通信组件516还包括近场通信(NFC) 模块, 以促进短程通信。 例如, 在NFC模块可基于射频识别(RFID)技术。

48、, 红外数据协会(IrDA) 技术, 超宽带(UWB)技术, 蓝牙(BT)技术和其他技术来实现。 0137 在示例性实施例中, 装置500可以被一个或多个应用专用集成电路(ASIC)、 数字信 号处理器(DSP)、 数字信号处理设备(DSPD)、 可编程逻辑器件(PLD)、 现场可编程门阵列 (FPGA)、 控制器、 微控制器、 微处理器或其他电子元件实现, 用于执行上述方法。 0138 在示例性实施例中, 还提供了一种包括指令的非临时性计算机可读存储介质, 例 如包括指令的存储器504, 上述指令可由装置500的处理器520执行以完成上述方法。 可选 地, 例如, 存储介质可以是非临时性计算。

49、机可读存储介质, 例如, 所述非临时性非临时性计 算机可读存储介质计算机可读存储介质可以是ROM、 随机存取存储器(RAM)、 CD-ROM、 磁带、 软盘和光数据存储设备等。 0139 本公开实施例提供的技术方案, 在检测到目标浏览器需要加载目标图片时, 获取 目标图片的图片格式; 在判定目标浏览器不支持图片格式时, 获取目标图片的预设类型的 图片编码格式, 其中, 目标浏览器支持预设类型的图片编码格式; 将目标图片的统一资源定 位符url替换为图片编码格式; 通过目标浏览器加载目标图片, 并展示目标图片。 0140 可见, 通过本公开实施例提供的技术方案, 在检测到目标浏览器不支持目标图片。

50、 的图片格式, 可以将目标图片的url替换为目标图片的预设类型的图片编码格式, 由于目标 浏览器支持预设类型的图片编码格式, 因此, 可以通过目标浏览器加载目标图片, 并展示目 标图片, 这样, 就可以让原本不支持webp格式的图片的浏览器能够兼容webp格式的图片, 即 能够成功加载目标图片, 并正常显示webp格式的图片。 0141 图6是根据一示例性实施例示出的一种用于图片加载装置600的框图。 例如, 装置 600可以被提供为一服务器。 参照图6, 装置600包括处理组件622, 其进一步包括一个或多个 处理器, 以及由存储器632所代表的存储器资源, 用于存储可由处理组件622的执行。

展开阅读全文
内容关键字: 图片 加载 方法 装置 电子设备 存储 介质
关于本文
本文标题:图片加载方法、装置、电子设备及存储介质.pdf
链接地址:https://www.zhuanlichaxun.net/pdf/9301456.html
关于我们 - 网站声明 - 网站地图 - 资源地图 - 友情链接 - 网站客服 - 联系我们

copyright@ 2017-2018 zhuanlichaxun.net网站版权所有
经营许可证编号:粤ICP备2021068784号-1