CN114692053A - 一种网页图片的无损压缩方法、电子设备及存储介质 - Google Patents

Abstract

本申请提供一种网页图片的无损压缩方法、电子设备及存储介质。应用于客户端，该方法包括：获取待压缩图片，待压缩图片显示在客户端运行的网页中；通过网页根据JavaScript无损图像压缩算法对待压缩图片进行处理，获得压缩图片，JavaScript无损图像压缩算法为预先利用编译器生成的适用于在网页上进行无损图像压缩的算法。通过结合网页和JavaScript无损图像压缩算法，实现了客户端网页图片的无损压缩，处理速率快，提高了网页图片压缩的质量。

Description

一种网页图片的无损压缩方法、电子设备及存储介质

技术领域

本申请涉及图像压缩技术领域，具体而言，涉及一种网页图片的无损压缩方法、电子设备及存储介质。

背景技术

现如今，随着信息技术的发展，摄像头像素的增大，普通手机拍摄的图片文件的大小一般在4-5MB甚至更高，在上传到网页的过程中，由于网络波动或者服务器限制上传图片文件大小的原因，容易出现上传失败的问题。

为了解决如上问题，目前采用的技术包括：通过网页端将图片传输至服务器，由服务器进行压缩后返回，但在图片传输过程中容易受到网络波动的影响；或在网页端通过Canvas(画布函数)实现压缩效果，不经过服务器，但这样会导致图片质量损耗严重，无法保证清晰度。

发明内容

本申请实施例的目的在于提供一种网页图片的无损压缩方法、电子设备及存储介质，用以提高压缩图片的图像质量和处理速率。

第一方面，本申请实施例提供一种网页图片的无损压缩方法，应用于客户端，所述方法包括：获取待压缩图片，其中，所述待压缩图片显示在所述客户端运行的网页中；通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，获得压缩图片，其中，所述JavaScript无损图像压缩算法为预先利用编译器生成的适用于在所述网页上进行无损图像压缩的算法。

本申请实施例中，通过在网页运行JavaScript无损图像压缩算法对待压缩图片进行处理，免去了从网页上传至服务器压缩后返回的动作，提高了图片压缩的处理速率和压缩质量，保护了图片的隐私性。

进一步地，所述通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，包括：通过所述网页调用二进制转换函数将所述待压缩图片转换为二进制文件；获取原始图像压缩算法，所述原始图像压缩算法对应的语言为C语言或C++语言；通过所述网页根据Emscripten编译器将所述原始图像压缩算法编译成JavaScript无损压缩算法，以供所述网页运行；通过所述网页调用所述JavaScript无损压缩算法对所述二进制文件进行处理，得到修改后的二进制文件；通过所述网页调用图片转换函数将所述修改后的二进制文件转换成压缩图片。

本申请实施例中，通过将待压缩图片转换成二进制文件，根据Emscripten编译器将原始无损压缩算法转换成JavaScript无损压缩算法，利用运行在网页上的JavaScript无损压缩算法对待压缩图片对应的二进制文件进行处理，得到压缩图片对应的二进制文件，再将二进制文件转换成压缩图片，完成网页图片压缩过程，利用Emscripten编译器完成了原始无损压缩算法的转换，方便了网页引擎的直接运行。

进一步地，所述在获取待压缩图片之后还包括：获取压缩比例；相应地，所述通过所述网页根据所述JavaScript无损压缩算法对所述二进制文件进行处理包括：按照所述压缩比例调用所述JavaScript无损压缩算法中对应的压缩函数对所述二进制文件进行处理。

本申请实施例中，通过获取压缩比例，按照压缩比例选取JavaScript无损压缩算法中对应的无损压缩函数，按照无损压缩函数对待压缩图片对应的二进制文件进行处理，得到按照一定压缩比例获得的压缩图片，能够实现网页图片压缩的灵活性，提高用户使用过程中的体验。

进一步地，所述待压缩图片中包括多张图片，所述通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，获得压缩图片包括：通过所述网页根据所述JavaScript无损压缩算法分别对所述多张图片进行无损压缩，获得每张图片分别对应的压缩图片；通过所述网页将所述多张压缩图片转换成zip压缩包。

本申请实施例中，由于待压缩图片中包括多张图片，通过JavaScript无损压缩算法能够分别对多张图片进行处理，获得每张图片对应的压缩图片，并将多张压缩图片转换成zip压缩包，实现了网页图片的批量压缩过程，加快了图片压缩处理效率，减少了用户操作，节省时间。

进一步地，所述在获得压缩图片之后，所述方法还包括：将所述待压缩图片和所述压缩图片展示在所述网页上。

本申请实施例中，在获得压缩图片之后，通过将待压缩图片和压缩图片展示在网页上，能够在网页上对待压缩图片和压缩图片进行展示，便于直观对比待压缩图片和压缩图片的图像质量差异，更为清晰地展示图片压缩效果。

进一步地，所述在获得压缩图片之后还包括：接收所述压缩图片或所述zip压缩包的下载请求；根据所述下载请求将所述网页中的所述压缩图片或所述zip压缩包下载到本地磁盘中。

本申请实施例中，在获得压缩图片之后，通过接收压缩图片的下载请求，根据下载请求将网页中的压缩图片下载到本地磁盘中，能够实现压缩图片的下载，方便用户的使用。

进一步地，所述待压缩图片以及所述压缩图片存储在所述网页的缓存中。

本申请实施例中，通过将待压缩图片和压缩图片存储在所述网页的缓存中，利用客户端网页的性能完成图片的压缩过程，在压缩过程中不与服务器端发生数据交互，保证了数据的隐私性，利用缓存加快了数据的处理效率。

第二方面，本申请实施例一种网页图片的无损压缩系统，其特征在于，包括：获取模块，获取待压缩图片，其中，所述待压缩图片显示在所述客户端运行的网页中；压缩模块，通过所述网页根据无损图像压缩算法对所述待压缩图片进行无损压缩，获得压缩图片，其中，所述JavaScript无损图像压缩算法为预先利用编译器生成的适用于在所述网页上进行图像压缩的算法。

第三方面，本申请实施例提供一种电子设备，包括：处理器、存储器和总线，其中，所述处理器和所述存储器通过所述总线完成相互间的交互；

所述存储器存储有可被所述处理器执行的程序指令，所述处理器调用所述程序指令能够执行第一方面的方法。

第四方面，本申请实施例提供一种非暂态计算机可读存储介质，包括：

所述非暂态计算机可读存储介质存储计算机指令，所述计算机指令使所述计算机执行第一方面的方法。

本申请的其他特征和优点将在随后的说明书阐述，并且，部分地从说明书中变得显而易见，或者通过实施本申请实施例了解。本申请的目的和其他优点可通过在所写的说明书、权利要求书、以及附图中所特别指出的结构来实现和获得。

附图说明

为了更清楚地说明本申请实施例的技术方案，下面将对本申请实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本申请的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。

图1为本申请实施例提供的一种网页图片的无损压缩方法流程示意图；

图2为本申请实施例提供的另一种网页图片的无损压缩方法流程示意图；

图3为本申请实施例提供的一种网页图片的无损压缩系统结构示意图；

图4为本申请实施例提供的电子设备实体结构示意图。

具体实施方式

下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行描述。

图1为本申请实施例提供的一种网页图片的无损压缩方法流程示意图，如图1所示，该方法可以应用于各类客户端中，包括各种web平台、嵌入式浏览器，PC端和移动端网页，各类APP软件中自带的浏览器页面、小程序，通过网页静态资源加载完毕后即可实现待压缩图片的无损压缩过程，包括在线和离线条件下，对于提升网页的加载速度，提升用户体验，完成用户所需功能具有重要意义。本申请实施例中的网页图片的无损压缩可以理解为利用客户端网页的前端技术实现的一种图片无损压缩过程。该方法包括：

步骤101：获取待压缩图片，其中，所述待压缩图片显示在所述客户端运行的网页中。

在具体的实施过程中，网页运行在所述客户端中，当网页在客户端中打开时，客户端加载网页的静态资源，保证网页的正常运行。待压缩图片可以是网络中的图片，也可以是手机拍摄的照片，本申请不对待压缩图片的文件大小和格式进行限制。网页可以为各类web网站、微信H5、其他APP软件中内嵌的浏览器，使用统一HTML5(超文本5.0)语言，实现客户端的网页浏览功能，待压缩图片经用户上传至客户端打开的网页中，可以在该网页上进行显示，网页还可获取待压缩图片的文件格式和文件大小，均可展示在网页上。可以理解的是，待压缩图片的来源包括多种方式，例如：具有压缩功能的网页上提供一个上传接口获取待压缩图片。

为了确保网页能够对待压缩图片进行压缩，网页在获取待压缩图片的过程中，会对待压缩图片的格式进行检查，保证符合图片的格式要求，待压缩图片的格式包括PNG、JPEG、JPG等格式，客户端网页在获取到待压缩图片时，利用图片上传接口对待压缩图片的格式进行检查，若符合图片格式要求，则通过网页继续对图片进行无损压缩。

步骤102：通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，获得压缩图片，其中，所述JavaScript无损图像压缩算法为预先利用编译器生成的适用于在所述网页上进行无损图像压缩的算法。

在具体的实施过程中，JavaScript无损图像压缩算法可以是预先利用编译器生成的能够在网页上运行的JavaScript程序，用于对待压缩图片进行处理，得到压缩图片，转编译器可以将后端运行的各类压缩算法包括C算法或C++算法转换成JavaScript算法，以供网页运行。编译器可以为各种编译器，用于实现将C或者C++代码转换成JavaScript代码，转换后的JavaScript代码能够在网页上直接运行，以实现网页图片的压缩。

在上述实施例的基础上，所述通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，包括：

通过所述网页调用二进制转换函数将所述待压缩图片转换为二进制文件；

获取原始图像压缩算法，所述原始图像压缩算法对应的语言为C语言或C++语言；

通过所述网页根据Emscripten编译器将所述原始图像压缩算法编译成JavaScript无损压缩算法，以供所述网页运行；

通过所述网页调用所述JavaScript无损压缩算法对所述二进制文件进行处理，得到修改后的二进制文件；

通过所述网页调用图片转换函数将所述修改后的二进制文件转换成压缩图片。

在具体的实施方式中，原始图像压缩算法为各种运行在服务器端的压缩算法，为C语言或者C++语言，例如mozjpeg，是一种JPEG图片的C++压缩算法，通过Emscripten编译器转换成JavaScript无损压缩算法，使之能够在网页中运行。Emscripten编译器能够将C/C++代码编译成JavaScript代码，Emscripten是一种基于LLVM(Low Level Vitual Machine底层虚拟机)的开源编译器，在LLVM中提供了各种关于编译器的支持，Emscripten通过将原始图像压缩算法编译成一种asm.js文件，该asm.js文件为编译得到的JavaScript无损压缩图像算法的代码文件，是一种JavaScript代码的变体，完全支持在各类网页上运行。

二进制转换函数和图片转换函数为HTML5中的应用接口，完成图片和二进制文件的相互转换过程，例如：网页通过图片上传接口FileReader读取待压缩图片时，并将待压缩图片转换成二进制文件Base64格式，通过网页运行Emscripten编译器编译过来的asm.js代码文件对二进制文件进行处理，得到修改后的二进制文件，通过网页运行图片转换函数Canvas.ToBlob通过将修改后的二进制文件Base64格式转换成图片格式的压缩图片展示在网页上。

在上述实施例的基础上，所述在获取待压缩图片之后还包括：

获取压缩比例；

相应地，所述通过所述网页根据所述JavaScript无损压缩算法对所述二进制文件进行处理包括：

按照所述压缩比例调用所述JavaScript无损压缩算法中对应的压缩函数对所述二进制文件进行处理。

在具体的实施过程中，在网页的显示界面上，网页还提供了压缩比例以供用户输入或选择，压缩比例是指压缩图片相对于待压缩图片减少的文件大小与压缩图片的文件大小之比，本申请不对压缩比例的范围大小进行限定。通过获取压缩比例可以实现不同压缩比例的压缩图片，满足用户的需要。例如：网页的前端界面设置有20％、40％、60％、80％等压缩比例供用户选择，还设置有输入框用于输入压缩比例，用户可以随意输入，为了保证压缩后的效果，输入的压缩比例在20％-80％内效果最好。若待压缩图片的文件大小为2.0MB，选择压缩比例为80％，则压缩后的图片文件大小为400KB，以此类推，待压缩图片的文件大小为3.0MB，选择压缩比例为60％，则压缩后的图片文件大小为1.2MB。

在上述实施例的基础上，所述待压缩图片中包括多张图片，所述通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，获得压缩图片包括：

通过所述网页根据所述JavaScript无损压缩算法分别对所述多张图片进行无损压缩，获得每张图片分别对应的压缩图片；

通过所述网页将所述多张压缩图片转换成zip压缩包。

在具体的实施过程中，待压缩图片可以是多张图片，通过继续添加图片的方式添加多张图片，或者一次性添加多张图片，本申请不对获取待压缩图片的方式进行限定。网页可以根据JavaScript无损压缩算法分别对多张图片进行无损压缩，得到多张图片对应的压缩图片，完成压缩后，网页还可将多张压缩图片转换成zip压缩包，方便用户一次性下载多张图片，处理速率更快，更简便。

在上述实施例的基础上，所述在获得压缩图片之后，所述方法还包括：

将所述待压缩图片和所述压缩图片展示在所述网页上。

在具体的实施过程中，网页还提供待压缩图片和压缩图片的对比展示，展示的内容可以为图像显示内容、文件大小、图片格式、压缩比例，本申请不对展示的内容进行限定。

在上述实施例的基础上，所述在获得压缩图片之后还包括：

接收所述压缩图片的下载请求；

根据所述下载请求将所述网页中的所述压缩图片或所述zip压缩包下载到本地磁盘中。

在具体的实施过程中，下载请求可以是用户从客户端设备发出的请求，待压缩图片为一张图片时，用于下载该压缩图片，接收到压缩图片的下载请求后，客户端设备根据下载请求将压缩图片下载到本地磁盘中。若待压缩图片中包含多张图片，经过网页压缩后转换成zip压缩包，因此客户端设备根据下载请求会将多张图片转换后的zip压缩包下载到本地磁盘中。

图2为本申请实施例提供的另一种网页图片的无损压缩方法流程示意图，如图2所示，包括：

步骤201：等待客户端中的网页静态资源加载完毕；

步骤202：通过文件输入框获取待压缩图片，输入压缩比例；待压缩图片中可以包含多张图片；

步骤203：通过所述网页将待压缩图片转换成二进制文件；若为多张图片，则通过所述网页将每张图片转换成对应的二进制文件；

步骤204：通过网页运行JavaScript无损压缩算法对所述二进制文件进行处理,得到压缩图片；若输入的待压缩图片包括多张图片，则通过网页运行JavaScript无损压缩算法分别对每个二进制文件进行处理，得到多张压缩图片，并将多张压缩图片转换成zip压缩包；

步骤205：获取下载请求，根据下载请求下载压缩图片或zip压缩包。

在上述实施例的基础上，所述待压缩图片以及所述压缩图片存储在所述网页的缓存中。

在具体的实施过程中，在网页完成初始数据的加载后，待压缩图片可以通过图片上传接口上传到网页中，网页利用自身资源完成图片压缩过程，其中，待压缩图片和压缩图片均存储在网页的缓存中，不会与服务器发生数据交互过程，杜绝了第三方服务器保存用户数据，保护用户数据隐私。可以理解的是，网页初始数据的加载以及图片压缩均可以在在线/离线条件下使用，例如：一些网页可以被下载在本地磁盘中在离线条件下脱机使用，不存在与服务器之间的数据交互。

在上述实施例的基础上，所述在获取待压缩图片之后还包括：

获取压缩图片的预设文件大小；

根据所述预设文件大小计算所述第二压缩比例；

相应地，所述通过所述网页根据所述JavaScript无损压缩算法对所述二进制文件进行处理包括：

按照所述第二压缩比例调用所述JavaScript无损压缩算法中对应的压缩函数对所述二进制文件进行处理。

在具体的实施过程中，考虑到用户对于压缩比例的概念不是特别清晰，本申请给出了另外一种设定的方式，包括：由用户设定或者选择压缩后的图片大小，根据压缩后的图片文件大小与待压缩图片的文件大小的比值计算第二压缩比例，此处的第二压缩比例是根据预设的压缩图片的文件大小计算得到，本申请不对预设的图片压缩大小进行限定。通过预设压缩图片的文件大小可以明确用户想要获取的压缩后的图片大小，提升用户的使用体验。在获取待压缩图片后，可根据待压缩图片的大小按照20％-80％的压缩比例计算预设的压缩后的图片大小。例如：待压缩图片的大小为2.0MB，根据20％-80％的压缩比例，计算出预设的压缩后的图片文件大小为400KB-1.6MB，用户可在该区间内选择合适的压缩后的图片大小。

在上述实施例的基础上，所述在获取待压缩图片之后还包括：

通过所述网页将待压缩图片分割成多张部分图片；

在上述实施例的基础上，所述通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，获得压缩图片包括：

通过所述网页根据所述JavaScript无损压缩算法分别对所述多个部分图片进行无损压缩，获得每个部分图片分别对应的部分压缩图片；

通过所述网页将所述多张部分压缩图片组合成压缩图片。

在具体的实施过程中，针对待压缩图片的文件大小太大导致压缩耗时较长的情况，网页可以对待压缩图片进行一个快速的分割，前端可以运行Canvas切片的方式将待压缩图片分割成多个部分，加快待压缩图片的处理效率。为了保证后面部分压缩图片的组合，这里的分割理解成一种等分的方式，保证多个部分压缩图片组合成完整的压缩图片。例如：获取待压缩图片，待压缩图片的大小为8MB，通过网页根据Canvas.clip函数对待压缩图片进行切片，等分成四部分，每个部分图片的大小为2MB，通过网页根据JavaScript无损压缩算法对每个部分图片进行处理，得到每个部分图片对应的部分压缩图片，根据前端Canvas.drawImage将多个部分压缩图片组合得到完整压缩图片，实现将待压缩图片分割压缩后重新组合的效果。

在上述实施例的基础上，所述在获得压缩图片之后还包括：

接收所述压缩图片的下载请求；

根据所述下载请求获取预设的压缩图片的文件保存格式；

若所述压缩图片的原始格式与所述文件保存格式不符，通过所述网页根据所述文件保存格式对所述压缩图片进行转换，得到第二压缩图片；

根据所述下载请求将所述网页中的所述第二压缩图片下载到本地磁盘中。

在具体的实施过程中，在获得压缩图片之后，网页提供压缩图片的下载方式，下载请求中存有压缩图片的保存格式，若网页上保存的压缩图片的格式与保存格式不符，则通过网页对压缩图片进行转换，得到符合保存格式的压缩图片，用户可以随意选择压缩图片的保存格式，方便用户的使用。可以理解的是，压缩图片的下载请求中记录了压缩图片下载到在本地磁盘的保存形式，根据压缩图片的保存要求将压缩图片下载到本地磁盘中。

在上述实施例的基础上，所述客户端中设有图片压缩插件，所述JavaScript无损压损压缩算法集成在所述图片压缩插件中，通过所述网页运行所述图片插件对待压缩图片进行处理，获得压缩图片。

在具体的实施过程中，由于JavaScript无损压缩算法的代码量大，通过客户端运行相关代码的方式的运行速度有待提高，将JavaScript无损压缩算法代码集成到图片压缩插件中，图片压缩插件提前安装在客户端中，当网页对待压缩图片进行处理时，启动图片压缩插件，实现待压缩图片的无损压缩，实现压缩过程，有利于提高网页图片压缩的运行效率。

图3为本申请实施例提供的网页图片的压缩系统结构示意图，该系统可以是电子设备上的模块、程序段或代码。应理解，该系统与上述图1方法实施例对应，能够执行图1方法实施例涉及的各个步骤，该系统具体的功能可以参见上文中的描述，为避免重复，此处适当省略详细描述。该系统包括：

获取模块301和压缩模块302，其中：

获取模块301用于获取待压缩图片，其中，所述待压缩图片显示在所述客户端运行的网页中；压缩模块302用于通过所述网页根据无损图像压缩算法对所述待压缩图片进行无损压缩，获得压缩图片，其中，所述JavaScript无损图像压缩算法为预先利用编译器生成的适用于在所述网页上进行图像压缩的算法。

在上述实施例的基础上，压缩模块302具体用于：

通过所述网页调用二进制转换函数将所述待压缩图片转换为二进制文件；

获取原始图像压缩算法，所述原始图像压缩算法对应的语言为C语言或C++语言；

通过所述网页根据Emscripten编译器将所述原始图像压缩算法编译成JavaScript无损压缩算法，以供所述网页运行；

通过所述网页调用所述JavaScript无损压缩算法对所述二进制文件进行处理，得到修改后的二进制文件；

通过所述网页调用图片转换函数将所述修改后的二进制文件转换成压缩图片。

在上述实施例的基础上，压缩模块302具体用于：

获取待压缩图片和压缩比例；

通过所述网页调用二进制转换函数将所述待压缩图片转换为二进制文件；

获取原始图像压缩算法，所述原始图像压缩算法对应的语言为C语言或C++语言；

通过所述网页根据Emscripten编译器将所述原始图像压缩算法编译成JavaScript无损压缩算法，以供所述网页运行；

按照所述压缩比例调用所述JavaScript无损压缩算法中对应的压缩函数对所述二进制文件进行处理，得到修改后的二进制文件；

通过所述网页调用图片转换函数将所述修改后的二进制文件转换成压缩图片。

在上述实施例的基础上，压缩模块302具体用于：

通过所述网页根据所述无损压缩算法分别对所述多张图片进行无损压缩，获得每张图片分别对应的压缩图片；

通过所述网页将所述多张压缩图片转换成zip压缩包。

在上述实施例的基础上，该系统还包括显示模块，用于：

将所述待压缩图片和所述压缩图片展示在所述网页上。

在上述实施例的基础上，该系统还包括接收模块，用于：

接收所述压缩图片或所述zip压缩包的下载请求；

根据所述下载请求将所述网页中的所述压缩图片或所述zip压缩包下载到本地磁盘中。

在上述实施例的基础上，该系统还包括存储模块，用于：

将待压缩图片以及所述压缩图片存储在所述网页的缓存中。

图4为本申请实施例提供的电子设备实体结构示意图，如图4所示，所述电子设备，包括：处理器(processor)401、存储器(memory)402和总线403；其中，

所述处理器401和存储器402通过所述总线403完成相互间的交互；

所述处理器401用于调用所述存储器402中的程序指令，以执行上述各方法实施例所提供的方法，例如包括：获取待压缩图片，其中，所述待压缩图片显示在所述客户端运行的网页中；通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，获得压缩图片，其中，所述JavaScript无损图像压缩算法为预先利用编译器生成的适用于在所述网页上进行无损图像压缩的算法。

处理器401可以是一种集成电路芯片，具有信号处理能力。上述处理器401可以是通用处理器，包括中央处理器(Central Processing Unit，CPU)、网络处理器(NetworkProcessor，NP)等；还可以是数字信号处理器(DSP)、专用集成电路(ASIC)、现成可编程门阵列(FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。其可以实现或者执行本申请实施例中公开的各种方法、步骤及逻辑框图。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。

存储器402可以包括但不限于随机存取存储器(Random Acc·ess Memory，RAM)，只读存储器(Read Only Memory，ROM)，可编程只读存储器(Programmable Read-OnlyMemory，PROM)，可擦除只读存储器(Erasable Programmable Read-Only Memory，EPROM)，电可擦除只读存储器(Electrically Erasable Programmable Read-Only Memory，EEPROM)等。

本实施例公开一种计算机程序产品，所述计算机程序产品包括存储在非暂态计算机可读存储介质上的计算机程序，所述计算机程序包括程序指令，当所述程序指令被计算机执行时，计算机能够执行上述各方法实施例所提供的方法，例如包括：获取待压缩图片，其中，所述待压缩图片显示在所述客户端运行的网页中；通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，获得压缩图片，其中，所述JavaScript无损图像压缩算法为预先利用编译器生成的适用于在所述网页上进行无损图像压缩的算法。

本实施例提供一种非暂态计算机可读存储介质，所述非暂态计算机可读存储介质存储计算机指令，所述计算机指令使所述计算机执行上述各方法实施例所提供的方法，例如包括：获取待压缩图片，其中，所述待压缩图片显示在所述客户端运行的网页中；通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，获得压缩图片，其中，所述JavaScript无损图像压缩算法为预先利用编译器生成的适用于在所述网页上进行无损图像压缩的算法。

在本申请所提供的实施例中，应该理解到，所揭露系统和方法，可以通过其它的方式实现。以上所描述的系统实施例仅仅是示意性的，例如，所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，又例如，多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或交互连接可以是通过一些交互接口，系统或单元的间接耦合或交互连接，可以是电性，机械或其它的形式。

另外，作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

再者，在本申请各个实施例中的各功能模块可以集成在一起形成一个独立的部分，也可以是各个模块单独存在，也可以两个或两个以上模块集成形成一个独立的部分。

在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。

以上所述仅为本申请的实施例而已，并不用于限制本申请的保护范围，对于本领域的技术人员来说，本申请可以有各种更改和变化。凡在本申请的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本申请的保护范围之内。

Claims (10)

1.一种网页图片的无损压缩方法，其特征在于，应用于客户端，包括：

获取待压缩图片，其中，所述待压缩图片显示在所述客户端运行的网页中；

通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，获得压缩图片，其中，所述JavaScript无损图像压缩算法为预先利用编译器生成的适用于在所述网页上进行无损图像压缩的算法。

2.根据权利要求1所述的方法，其特征在于，所述通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，包括：

通过所述网页调用二进制转换函数将所述待压缩图片转换为二进制文件；

获取原始图像压缩算法，所述原始图像压缩算法对应的语言为C语言或C++语言；

通过所述网页根据Emscripten编译器将所述原始图像压缩算法编译成JavaScript无损压缩算法，以供所述网页运行；

通过所述网页调用所述JavaScript无损压缩算法对所述二进制文件进行处理，得到修改后的二进制文件；

通过所述网页调用图片转换函数将所述修改后的二进制文件转换成压缩图片。

3.根据权利要求2所述的方法，其特征在于，所述在获取待压缩图片之后还包括：

获取压缩比例；

相应地，所述通过所述网页根据所述JavaScript无损压缩算法对所述二进制文件进行处理包括：

按照所述压缩比例调用所述JavaScript无损压缩算法中对应的压缩函数对所述二进制文件进行处理。

4.根据权利要求1所述的方法，其特征在于，所述待压缩图片中包括多张图片，所述通过所述网页根据JavaScript无损图像压缩算法对所述待压缩图片进行处理，获得压缩图片包括：

通过所述网页根据所述JavaScript无损压缩算法分别对所述多张图片进行无损压缩，获得每张图片分别对应的压缩图片；

通过所述网页将所述多张压缩图片转换成zip压缩包。

5.根据权利要求1所述的方法，其特征在于，所述在获得压缩图片之后，所述方法还包括：

将所述待压缩图片和所述压缩图片展示在所述网页上。

6.根据权利要求1或4所述的方法，其特征在于，所述在获得压缩图片之后还包括：

接收所述压缩图片或所述zip压缩包的下载请求；

根据所述下载请求将所述网页中的所述压缩图片或所述zip压缩包下载到本地磁盘中。

7.根据权利要求1-6任一项所述的方法，其特征在于，所述待压缩图片以及所述压缩图片存储在所述网页的缓存中。

8.一种网页图片的无损压缩系统，其特征在于，包括：

获取模块，获取待压缩图片，其中，所述待压缩图片显示在所述客户端运行的网页中；

压缩模块，通过所述网页根据无损图像压缩算法对所述待压缩图片进行无损压缩，获得压缩图片，其中，所述JavaScript无损图像压缩算法为预先利用编译器生成的适用于在所述网页上进行图像压缩的算法。

9.一种电子设备，其特征在于，包括：处理器、存储器和总线，其中，

所述处理器和所述存储器通过所述总线完成相互间的通信；

所述存储器存储有可被所述处理器执行的程序指令，所述处理器调用所述程序指令能够执行如权利要求1-7任一项所述的方法。

10.一种非暂态计算机可读存储介质，其特征在于，所述非暂态计算机可读存储介质存储计算机指令，所述计算机指令被计算机运行时，使所述计算机执行如权利要求1-7任一项所述的方法。

Images