CN103139292A - 在http代理中处理图片的方法、代理服务器及系统 - Google Patents

Abstract

本发明公开一种在HTTP代理中处理图片的方法，包括以下步骤：客户端与服务器建立连接，代理服务器对所述连接做代理；代理服务器截获客户端与服务器之间的交互数据，并检查交互数据中是否包括图片数据；当交互数据中包括图片数据时，根据预置的用户配置策略对所述图片进行处理。本发明还提供一种用以实现上述方法的在HTTP代理中处理图片的代理服务器和系统。本发明能提升用户浏览网站时的用户体验。

Description

在HTTP代理中处理图片的方法、代理服务器及系统

技术领域

本发明涉及网络领域，特别涉及一种在HTTP代理中处理图片的方法、代理服务器及系统。

背景技术

随着互联网应用和移动互联网应用的日益发展和普及，互联网上的图片越来越多。在绝大部分web系统中，图片流量占了总流量的70%以上。因此，优化图片格式、降低图片文件大小，对提升web系统的性能、提升web的访问速度以及减少web系统对带宽的需求有着决定性的作用。

当网站存在较大的图片需要显示时，例如一些广告图片其分辨率可达到560*95，更有甚者，一些广告图片分辨率大小可达到768*90，图片大小在100KB以上。此类大图片的显示会导致需下载更多的流量，更长的图片下载时间和页面加载显示时间，致使用户等待网页显示的时间较长，用户体验较差。而在目前移动终端的网络条件下，下载和显示此类图片会导致体验更差，在图片未下载完前，页面显示格式不对或者显示错乱或者甚至不能显示，给用户的体验很差。

现有技术中，解决此类问题的方法一般是网站自身尽量少用大图片，对大图片尽快压缩以减少图片大小，但此方法存在很大的局限性：一方面一些网站对于大图片不能完全避免不用，比如大的广告图片和本身就是图片类的网站；另一方面对图片过量压缩也会导致图片质量下降，一般只能在图像质量和图像大小之间做一个平衡，最终各个网站还是存在大量的较大图片的显示，并不能完全避免。

发明内容

本发明的主要目的在于提供一种在HTTP代理中处理图片的方法，旨在解决现有技术中存在较大图片导致用户等待网页显示的时间较长的技术问题。

为了实现发明目的，本发明提供一种在HTTP代理中处理图片的方法，包括以下步骤：

客户端与服务器建立连接，代理服务器对所述连接做代理；

代理服务器截获客户端与服务器之间的交互数据，并检查交互数据中是否包括图片数据；

当交互数据中包括图片数据时，根据预置的用户配置策略对所述图片进行处理。

优选地，所述预置的用户配置策略包括图片替换策略、图片显示策略和图片格式转换策略。

优选地，在执行所述根据预置的用户配置策略对所述图片进行处理之前还包括：

分析所述交互数据中的图片数据，判断是否为大图；

所述判断是否为大图的方法包括根据图片的分辨率、大小，和预置的大图分辨率阈值、大小阈值比对来判断所述图片是否为大图。

优选地，所述用户配置策略为图片替换策略；所述根据预置的用户配置策略对所述图片进行处理包括：

用指定图片替换待处理图片；或，

将所述图片转换成缩略图并替换待处理图片；

对响应数据中超文本标记语言HTML中的大图图片标签进行处理，以显示替换后的图片。

优选地，所述用户配置策略为图片显示策略；所述根据预置的用户配置策略对所述图片进行处理包括：

对响应的HTML页面进行处理，包括：

立即让被替换后的图片标签，重新加载原始图片；

或延迟一定时间后，重新加载原始图片；

或仅在用户产生特定行为时，被替换的图片标签才重新加载原始图片，否则只显示替换后的缩略图或者固定图片；

用户产生特定的行为，包括但不限于用户点击图片、用户鼠标移动到图片上、用户输入焦点移到图片标签、用户滚动条下来、鼠标滚动等操作行为。

优选地，所述用户配置策略为图片格式转换策略；所述根据预置的用户配置策略对所述图片进行处理包括：

将图片格式转换为另外一种格式，并判断转换后的图片大小；如转换后的大小比原始图片还大，则继续转换为另外一种格式，直至找到一种转换后比原始图片更小的格式；转换的格式包括但不限于jpg转为png、jpg转为webp、gif转为png、gif转为webp、同一种格式转为容量更小的图片；图片格式一旦转换成功，则修改响应数据中的content-type字段为转换后的新格式。

本发明还提供一种在HTTP代理中处理图片的代理服务器，其包括：

监听模块，用于监听客户端浏览器与HTTP服务器之间的连接；

代理模块，用于对客户端与服务器之间的连接做代理；

图片检测模块，用于检测客户端浏览器与服务器之间的交互数据是否包括图片数据，并判断所述图片是否为大图；

图片处理模块，用于当交互数据包括图片时，根据预置的用户配置策略对所述图片进行处理。

优选地，上述代理服务器还包括：

图片信息分析模块，用于分析交互数据中的图片信息；

图片大小判断模块，用于判断图片是否为大图，判断方法包括但不限于根据图片的分辨率、图片的大小与阈值对比进行判断。

优选地，所述图片处理模块具体用于：

用指定图片替换所述待处理图片；或

将所述图片转换成缩略图并替换；

对超文本标记语言HTML语言进行处理，对所述图片的标签显示成替换后的图片。

优选地，所述图片处理模块具体用于：

对响应的HTML页面进行处理，包括：

立即让被替换后的图片标签，重新加载原始图片；

或延迟一定时间后，重新加载原始图片；

或仅在用户产生特定行为时，被替换的图片标签才重新加载原始图片，否则只显示替换后的缩略图或者固定图片；

用户产生特定的行为，包括但不限于用户点击图片、用户鼠标移动到图片上、用户输入焦点移到图片标签、用户滚动条下来、鼠标滚动等操作行为。

优选地，所述图片处理模块具体用于：

将图片格式转换为另外一种格式，并判断转换后的图片大小；如转换后的大小比原始图片还大，则继续转换为另外一种格式，直至找到一种转换后比原始图片更小的格式；转换的格式包括但不限于jpg转为png、jpg转为webp、gif转为png、gif转为webp、同一种格式转为容量更小的图片；图片格式一旦转换成功，则修改响应数据中的content-type字段为转换后的新格式。

本发明还提供一种在HTTP代理中处理图片的系统，包括客户端和服务器，其还包括代理服务器，该代理服务器包括：

监听模块，用于监听客户端浏览器与HTTP服务器之间的连接；

代理模块，用于对客户端与服务器之间的连接做代理；

图片检测模块，用于检测客户端浏览器与服务器之间的交互数据是否包括图片数据，并判断所述图片是否为大图；

图片处理模块，用于当交互数据包括图片时，根据预置的用户配置策略对所述图片进行处理。

本发明通过在网站前面配置前置代理服务器，对网站的大图片进行替换、显示以及转换格式等处理，可减少图片容量，提高网速，提升网站浏览者的用户体验。

附图说明

图1为本发明一实施例中在HTTP代理中处理图片的方法的步骤流程图；

图2为本发明一实施例中根据预置的用户配置策略对图片进行处理的步骤流程图；

图3为本发明又一实施例中根据预置的用户配置策略对图片进行处理步骤流程图；

图4为本发明一实施例中在HTTP代理中处理图片的代理服务器的结构示意图。

本发明目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

应当理解，此处所描述的具体实施例仅仅用于解释本发明，并不用于限定本发明。

参照图1，为本发明一实施例中在HTTP代理中处理图片的方法流程图。本发明实施例中，在HTTP代理中处理图片的方法包括以下步骤：

步骤S10，客户端与服务器建立连接，代理服务器对所述连接做代理；本发明实施例中，代理服务器安装在服务器前端，可代理HTTP服务，可以是上网行为管理设备、负载均衡器、缓存服务器、流量管理设备等，但不限于此类设备。

步骤S20，代理服务器截获客户端与服务器之间的交互数据，并检查交互数据中是否包括图片数据；用户通过客户端浏览器发送HTTP请求，由代理服务器将该请求转发至服务器，服务器会反馈响应数据。在此过程中，代理服务器可客户端与服务器之间的交互数据（例如服务器的响应数据等），并根据数据中的相关字段（例如content-type:image/jpg或content-type:image/gif字段）判断是否包含大容量的图片。

步骤S30，当交互数据中包括图片数据时，根据预置的用户配置策略对所述图片进行处理。本发明实施例中，用户配置策略由用户预置在代理服务器中，其目的在于减少图片容量，例如转换图片格式等。

本发明通过在网站前面配置前置代理服务器，对网站的大图片进行替换、显示以及转换格式等处理，可减少图片容量，提高网速，提升网站浏览者的用户体验。

用户配置策略包括图片替换策略、图片显示策略和图片格式转换策略。所谓图片替换策略即用缩略图或者指定的容量较小的图片替换待处理的图片；图片显示策略是指通过延时显示或者基于用户行为（例如点击图片等）显示等；所谓图片格式转换策略是指将jpeg或gif格式图片转换为其他格式（例如png或webp等）的图片。

本发明实施例中，在执行上述步骤S30之前，本发明在HTTP代理中处理图片的方法还包括：

分析所述交互数据中的图片数据，判断是否为大图；例如，首先分析服务器返回的HTML数据，如是压缩数据，则对其解压，然后分析HTML文件的IMG标签，找出大图片的IMG标签。其中，判断是否为大图的方法包括根据图片的分辨率、大小，和预置的大图分辨率阈值、大小阈值比对来判断所述图片是否为大图。例如，图片像素面积超过N的即为大图片，N可由用户配置。

本发明一实施例中，用户配置策略为图片替换策略，参见图2所示，在一实施方案中，上述步骤30具体可包括：

步骤S31，将所述图片转换成缩略图并替换待处理图片；本实施例中，将大图片生成一个小的缩略图，一般为32*32，大小在1k以下。生成缩略图的过程可以异步执行，并且将缩略图替换待处理图片。

步骤S32，对响应数据中超文本标记语言HTML中的大图图片标签进行处理，以显示替换后的图片。本实施例中，缩略图缓存后，将HTML的IMG标签的SRC地址替换成缩略图地址，比如在原地址后面加上?thumbnail,以便浏览器下次请求时，代理服务器能识别出是请求缩略图。由于缩略图分辨率一般是原图的十几分之一，所以浏览器在显示缩略图时，会拉升显示，显示出来的效果即是一个模糊的效果，在用户看来很像一个未完全加载完的图片一样，但不影响页面的显示效果。

本发明实施例中，还可采用另一种方案替换待处理图片，即用指定图片替换待处理图片。本实施方案同上述用缩略图替换的方案类似，只不过不替换成缩略图，而是替换成一个统一小图，比如可以对广告图片统一替换成一个小图，上有提示文字：“广告正在加载中”，或者提示：“请点击显示此广告”。

本发明另一实施例中，用户配置策略为显示策略。在一实施方案中，上述步骤S30可包括：

对响应的HTML页面进行处理，包括：

立即让被替换后的图片标签，重新加载原始图片；

或延迟一定时间后，重新加载原始图片；

或仅在用户产生特定行为时，被替换的图片标签才重新加载原始图片，否则只显示替换后的缩略图或者固定图片；

例如，通过在HTML页面中插入一段脚本JS代码，该JS代码在body加载完成立即执行或者指定延迟的时间后执行，执行时遍历所有的IMG大图节点，把IMG的大图重新加载，这时给予浏览者的体验就是大图加载完变清晰了。

在另一实施方案中，上述步骤S30也可包括如下步骤：

仅在用户产生特定行为时，被替换的图片标签才重新加载原始图片，否则只显示替换后的缩略图或者固定图片。用户特定的行为包括但不限于用户点击图片、用户鼠标移动到图片上、用户输入焦点移到图片标签、用户滚动条下来、鼠标滚动等操作行为。例如，可仅在用户点击、鼠标经过图片区域或用户滚动页面时显示原始图片，否则只显示替换后的缩略图或者固定图片。即只有在用户点击、鼠标经过该图片区域或用户滚动页面时，才把大图片显示出来，否则只显示替换后的缩略图或者固定图片。很多图片网站，特别是在一页里面显示大量图片的时，只有鼠标往下滚动才会刷新把图片显示出来，还有微博的刷新，也是这种类似的效果。给用户的体验就是图片的按需加载，想看的图片才加载，不想看的图片就不需要加载，节省了网络流量，同时也节省了时间。

本发明又一实施例中，用户配置策略为图片格式转换策略，参见图3所示，在本实施例中，上述步骤S30包括：

将图片格式转换为另外一种格式，并判断转换后的图片大小；如转换后的大小比原始图片还大，则继续转换为另外一种格式，直至找到一种转换后比原始图片更小的格式；转换的格式包括但不限于jpg转为png、jpg转为webp、gif转为png、gif转为webp、同一种格式转为容量更小的图片；图片格式一旦转换成功，则修改响应数据中的content-type字段为转换后的新格式。众所周知，png是一种图像文件存储格式。一般应用于JAVA程序中，或网页或S60程序中是因为它压缩比高，生成文件容量小。WebP是Google推出的一种图片格式，它基于VP8编码，可对图像大幅压缩。与JPEG相同，WebP也是一种有损压缩，但在画质相同的情况下，WebP格式比JPEG图像小40%左右。因此本发明实施例能减少图片容量，提高网速。另外，本实施例使用代理服务器做代理，来实现对图片格式进行转换，在对图片进行转换时，不需要修改web系统中的html代码，只需要在应用交付器完成图片格式转换并修改content-type头部为合适的mime类型，达到浏览器的对图片的正常显示的目的。

本发明另提供一种在HTTP代理中处理图片的代理服务器，设置在服务器与客户端之间，可实现上述方法。参照图4所示，在一实施例中，该代理服务器3至少包括：

监听模块10，用于监听客户端浏览器与HTTP服务器1之间的连接；

代理模块20，用于对客户端2与服务器1之间的连接做代理；

图片检测模块30，用于检测客户端浏览器与服务器1之间的交互数据是否包括图片数据，并判断所述图片是否为大图；

图片处理模块40，用于当交互数据包括图片时，根据预置的用户配置策略对所述图片进行处理。

本发明实施例中，代理服务器3安装在服务器前端，可代理HTTP服务，可以是上网行为管理设备、负载均衡器、缓存服务器、流量管理设备等，但不限于此类设备。用户通过客户端浏览器发送HTTP请求，由代理模块20将该请求转发至服务器1，服务器会反馈响应数据，此时监听模块10可截获服务器1的响应，并根据数据中的相关字段（例如content-type:image/jpg或content-type:image/gif字段）判断是否包含大容量的图片。

参见图4所示，在一实施例中，上述代理服务器3还包括：

图片信息分析模块21，用于分析交互数据中的图片信息；例如，图片信息分析模块30首先分析服务器返回的HTML数据，如是压缩数据，则对其解压，然后分析HTML文件的IMG标签，找出大图片的IMG标签。

图片大小判断模块22，用于判断图片是否为大图，判断方法包括但不限于根据图片的分辨率、图片的大小与阈值对比进行判断。例如，图片像素面积超过N的即为大图片，N可由用户配置。

本发明一实施例中，图片处理模块40具体用于：

用指定图片替换所述待处理图片；或

将所述图片转换成缩略图并替换；

对超文本标记语言HTML语言进行处理，对所述图片的标签显示成替换后的图片。

本实施例中，图片处理模块40将大图片生成一个小的缩略图，一般为32*32，大小在1k以下。生成缩略图的过程可以异步执行，并且将缩略图缓存下来。缩略图缓存后，将HTML的IMG标签的SRC地址替换成缩略图地址，比如在原地址后面加上?thumbnail,以便浏览器下次请求时，代理服务器3能识别出是请求缩略图。由于缩略图分辨率一般是原图的十几分之一，所以浏览器在显示缩略图时，会拉升显示，显示出来的效果即是一个模糊的效果，在用户看来很像一个未完全加载完的图片一样，但不影响页面的显示效果。

本发明实施例中，图片处理模块40还可采用另一种方案替换待处理图片，即用指定图片替换所述待处理图片。本实施方案同上述用缩略图替换的方案类似，只不过不替换成缩略图，而是替换成一个统一小图，比如可以对广告图片统一替换成一个小图，上有提示文字：“广告正在加载中”，或者提示：“请点击显示此广告”。

在本发明另一实施例中，图片处理模块40可具体用于：

对响应的HTML页面进行处理，包括：

立即让被替换后的图片标签，重新加载原始图片；

或延迟一定时间后，重新加载原始图片。例如可通过在HTML页面中插入一段脚本JS代码，该JS代码在body加载完成后立即执行或者指定延迟的时间后执行，执行时遍历所有的IMG大图节点，把IMG的大图重新加载，这时给予浏览者的体验就是大图加载完变清晰了。

在另一实施方案中，图片处理模块40也可仅在用户产生特定行为时，被替换的图片标签才重新加载原始图片，否则只显示替换后的缩略图或者固定图片。用户产生特定的行为包括但不限于用户点击图片、用户鼠标移动到图片上、用户输入焦点移到图片标签、用户滚动条下来、鼠标滚动等操作行为。即只有在用户点击、鼠标经过该图片区域或用户滚动页面时，才把大图片显示出来，否则只显示替换后的缩略图或者固定图片。很多图片网站，特别是在一页里面显示大量图片的时，只有鼠标往下滚动才会刷新把图片显示出来，还有微博的刷新，也是这种类似的效果。给用户的体验就是图片的按需加载，想看的图片才加载，不想看的图片就不需要加载，节省了网络流量，同时也节省了时间。

在本发明又一实施例中，图片处理模块40具体可用于：

将图片格式转换为另外一种格式，并判断转换后的图片大小；如转换后的大小比原始图片还大，则继续转换为另外一种格式，直至找到一种转换后比原始图片更小的格式；转换的格式包括但不限于jpg转为png、jpg转为webp、gif转为png、gif转为webp、同一种格式转为容量更小的图片；图片格式一旦转换成功，则修改响应数据中的content-type字段为转换后的新格式。所周知，png是一种图像文件存储格式。一般应用于JAVA程序中，或网页或S60程序中是因为它压缩比高，生成文件容量小。WebP是Google推出的一种图片格式，它基于VP8编码，可对图像大幅压缩。与JPEG相同，WebP也是一种有损压缩，但在画质相同的情况下，WebP格式比JPEG图像小40%左右。因此本发明实施例能减少图片容量，提高网速。另外，本实施例使用代理服务器做代理，来实现对图片格式进行转换，在对图片进行转换时，不需要修改web系统中的html代码，只需要在应用交付器完成图片格式转换并修改content-type头部为合适的mime类型，达到浏览器的对图片的正常显示的目的。

本发明还提供一种在HTTP代理中处理图片的系统，该系统包括前述客户端2和服务器1，其还包括代理服务器3，该代理服务器3的功能作用及实现原理可参见前述图1至图4及其对应的实施例，在此不作详述。由于设置有上述代理服务器3，本发明在HTTP代理中处理图片的系统能减少图片容量，提高网速，提升用户体验。

以上仅为本发明的优选实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本发明的专利保护范围内。

Claims (12)

1.一种在HTTP代理中处理图片的方法，其特征在于，包括以下步骤：

客户端与服务器建立连接，代理服务器对所述连接做代理；

代理服务器截获客户端与服务器之间的交互数据，并检查交互数据中是否包括图片数据；

当交互数据中包括图片数据时，根据预置的用户配置策略对所述图片进行处理。

2.如权利要求1所述的在HHTP代理中处理图片的方法，其特征在于，所述预置的用户配置策略包括图片替换策略、图片显示策略和图片格式转换策略。

3.如权利要求1或2所述的在HTTP代理中处理图片的方法，其特征在于，在执行所述根据预置的用户配置策略对所述图片进行处理之前还包括：

分析所述交互数据中的图片数据，判断是否为大图；

所述判断是否为大图的方法包括根据图片的分辨率、大小，和预置的大图分辨率阈值、大小阈值比对来判断所述图片是否为大图。

4.如权利要求2所述的在HTTP代理中处理图片的方法，其特征在于，所述用户配置策略为图片替换策略；所述根据预置的用户配置策略对所述图片进行处理包括：

用指定图片替换待处理图片；或，

将所述图片转换成缩略图并替换待处理图片；

对响应数据中超文本标记语言HTML中的大图图片标签进行处理，以显示替换后的图片。

5.如权利要求2所述的在HTTP代理中处理图片的方法，其特征在于，所述用户配置策略为图片显示策略；所述根据预置的用户配置策略对所述图片进行处理包括：

对响应的HTML页面进行处理，包括：

立即让被替换后的图片标签，重新加载原始图片；

或延迟一定时间后，重新加载原始图片；

或让在用户产生特定行为时，被替换的图片标签才重新加载原始图片，否则只显示替换后的缩略图或者固定图片；

用户产生特定的行为，包括但不限于用户点击图片、用户鼠标移动到图片上、用户输入焦点移到图片标签、用户滚动条下来、鼠标滚动等操作行为。

6.如权利要求2所述的在HTTP代理中处理图片的方法，其特征在于，所述用户配置策略为图片格式转换策略；所述根据预置的用户配置策略对所述图片进行处理包括：

将图片格式转换为另外一种格式，并判断转换后的图片大小；如转换后的大小比原始图片还大，则继续转换为另外一种格式，直至找到一种转换后比原始图片更小的格式；转换的格式包括但不限于jpg转为png、jpg转为webp、gif转为png、gif转为webp、同一种格式转为容量更小的图片；图片格式一旦转换成功，则修改响应数据中的content-type字段为转换后的新格式。

7.一种在HTTP代理中处理图片的代理服务器，其特征在于，包括：

监听模块，用于监听客户端浏览器与HTTP服务器之间的连接；

代理模块，用于对客户端与服务器之间的连接做代理；

图片检测模块，用于检测客户端浏览器与服务器之间的交互数据是否包括图片数据，并判断所述图片是否为大图；

图片处理模块，用于当交互数据包括图片时，根据预置的用户配置策略对所述图片进行处理。

8.如权利要求7所述的代理服务器，其特征在于，还包括：

图片信息分析模块，用于分析交互数据中的图片信息；

图片大小判断模块，用于判断图片是否为大图，判断方法包括但不限于根据图片的分辨率、图片的大小与阈值对比进行判断。

9.如权利要求7所述的代理服务器，其特征在于，所述图片处理模块具体用于：

用指定图片替换所述待处理图片；或

将所述图片转换成缩略图并替换；

对超文本标记语言HTML语言进行处理，对所述图片的标签显示成替换后的图片。

10.如权利要求7所述的代理服务器，其特征在于，所述图片处理模块具体用于：

对响应的HTML页面进行处理，包括：

立即让被替换后的图片标签，重新加载原始图片；

或延迟一定时间后，重新加载原始图片；

或仅在用户产生特定行为时，被替换的图片标签才重新加载原始图片，否则只显示替换后的缩略图或者固定图片；

用户产生特定的行为，包括但不限于用户点击图片、用户鼠标移动到图片上、用户输入焦点移到图片标签、用户滚动条下来、鼠标滚动等操作行为。

11.如权利要求7所述的代理服务器，其特征在于，所述图片处理模块具体用于：

将图片格式转换为另外一种格式，并判断转换后的图片大小；如转换后的大小比原始图片还大，则继续转换为另外一种格式，直至找到一种转换后比原始图片更小的格式；转换的格式包括但不限于jpg转为png、jpg转为webp、gif转为png、gif转为webp、同一种格式转为容量更小的图片；图片格式一旦转换成功，则修改响应数据中的content-type字段为转换后的新格式。

12.一种在HTTP代理中处理图片的系统，包括客户端和服务器，其特征在于，还包括如权利要求1至10中任一项所述的代理服务器。

Images