最近项目里面需要给用户提供一个图片裁剪和压缩的功能,这些图片是要推送到手机端,为了不过多浪费用户的流量,所以必须要压缩到某个阈值范围内。由于网站面向的用户都是偏低端的用户,而且他们绝大多数都是实用ie7,8的,所以不能使用html5来实现了。所以目前可用的方案只有两个:

  • 前端使用flash程序编辑图片后提交至后台保存;
  • 或 后端接收原始图片,在服务器端对图片进行裁剪和压缩等编辑操作。

经过调研,如果前端使用flash程序处理图片可以使用第三方的api(如美图秀秀apihttp://open.web.meitu.com/)或者前端重新开发一个图片处理的flash插件。后端处理图片可能的方案是在服务器端开发程序做图片处理,或者接入点评的图片中心以实现编辑的功能。

面临的问题

  1. 首先,前端使用美图秀秀api可以满足用户图片编辑的需求,但是存在跨域问题和UI不一致的问题。因为美图秀秀api需要调用美图的服务器,所以需要在服务器端配置跨域,但跨域存在安全性和稳定性的风险,而且商户端的网站是挂在在商户中心下,跨域之后会使得商户中心网站及其挂载在商户中心下的网站都面临安全性的问题,可能在使用的过程中受到恶意攻击。

  2. 其次,如果前端重新开发flash,时间会比较长,而且前端可以开发flash的资源较少。

  3. 第三,如果后端在服务器端直接处理图片,会导致服务器内存消耗过大,网站稳定性下降厉害,会付出较大的代价。而且使用java实现图片的压缩,效果并不好,这在测试程序中也可看出。因此在服务器端直接处理图片是一件吃力不讨好的方案。

  4. 最后一种方案就是新建一个服务器,专门用于图片处理的功能,这种服务器做完,也就基本做了一个图片云服务的服务器。这样做是一个长期可行的方案,但是要解决眼前的问题,耗费的时间太长。

所以想来想去,为了尽快的解决问题,还是采用美图秀秀的api,但是使用美图秀秀是需要跨域的,跨域毕竟存在安全性风险和稳定性风险。

问题的解决

要解决稳定性,必须要考虑美图秀秀服务器挂了该怎么办

美图秀秀服务器的稳定性,不是我们所能控制的,所以必须要在美图秀秀挂了的情况下,自己的网站依然能上传图片。为了解除这种依赖,我们在程序中增加了一个标志位配置,以区别是否实用美图秀秀。如果这个标志位是false的时候,我们就使用简单的上传图片功能。如果为true的话,就继续使用美图秀秀。

解决安全性问题

跨域的安全风险还是很多的,特别是容易遭到CSRF的攻击。为了规避这种风险,最好的方式是将跨域的这部分独立到另一个服务器上。因为图片上传的功能对服务器性能消耗不大,所以找一个低性能的虚拟机完全可以满足这个需求。

现在flash是一个日渐式微的技术,会做flash的人越来越少了,Html5的实现又有ie在拦着,所以这一段时间内将简单的图片编辑放到服务器才是最稳定的方案了。