Flash真的适合做网站应用吗?
来源:q.pnq.cc 发布时间:2011-04-16 10:34:00
两年前,我们开发了一套基于Flash的文件(主要是图片)上传RIA应用,提供给阿里巴巴的用户使用。如果你使用过Wordpress或flickr上传图片,你应该已经用过类似的产品。这个程序基于YUI Uploader开发,增加了一个实用的功能——在客户端先将图片缩小,再上传到服务器。用户用数码相机拍摄的照片往往有600万以上的像素,但产品图片放到阿里巴巴网站上显示,并不需要这么大的像素,通常等比例缩小到1024×1024之内就可以了。借助于Flash对图片先缩小再上传的技术,我们在没有增加服务器投入的情况下,将原先上传图片的尺寸限制由250KB/张提升到了5MB/张。同时,Flash上传还比传统HTML表单方式上传有更好的体验,例如可以多选一批文件同时上传、可以实时展示上传进度、选择文件时可以过滤非图片文件。
这个组件获得了很大的成功。上线后不久,阿里巴巴网站上用户的图片上传数量由日均1万张左右上升至日均15万张左右。但在这个上传应用投入应用的两年中,我们遇到了各种问题。
1. bug
在基于IE多标签浏览器中的伪沙箱问题就不说了,最严重的是cookie的问题。使用FileReference.upload的方式上传文件,http请求中附带的cookie信息不一定是当前浏览器进程的cookie,在Firefox、chrome等非IE浏览器中非常严重,可能传输的是IE中的cookie。即便是IE,也可能传输的cookie内容和当前页面的cookie记录不符合。这直接导致服务器端在收到文件之后的安全验证中失败。而对于阿里巴巴这样的大型网站,有比较成熟的java web框架,要去掉对cookie的依赖非常麻烦。于是结果就是,首先我们只有在用户使用IE系浏览器的时候才使用Flash上传,其次我们隔三岔五的还会收到使用IE的某些客户的投诉,在花费了大量的时间排查之后,我发现是由于cookie的问题导致上传失败。这个bug已经存在很多年,但是随着Flash从9升级到10,许多版本过去了,问题依然没有被解决。对于闭源的Flash,我们非常被动。
2.性能
相对于现今数码相机的像素量,5MB的大小限制非常保守。但大于5M的时候,在一些低配置的电脑上,读取文件内容的时候就会发生浏览器假死现象。假死很容易导致浏览器崩溃,所以我们采取了保守的限制——5MB。
另外一个性能消耗是将BitmapData编码成JPEG文件的时候。Adobe提供了JPEGEncoder,但由于是Array实现的,所以性能是个问题。编码一个2880×2880的图片在一台中等配置的电脑上大约需要15秒时间。
我用Vector改写了这个类,时间缩短为3.5秒左右。使用Alchemy,时间进一步缩短到1.5秒左右。但还是不够安全,所以最后采用了异步Vector的方式,延长编码的时间,以保证程序的稳定性。
3.图片质量
Flash内置的最好的图片缩小算法(用BitmapData.draw,并将smoothing参数设为true),在缩小图片的时候容易产生锯齿。因此我改写了Jacwright提供的缩小算法,图片质量的问题解决,但代价是性能又降低了一些。
4.安全限制
Flash10.0之后,增加了一个安全限制——当URLLoader以标准文件上传的方式发送POST请求的时候,需要由用户的UI操作(鼠标点击或按键事件)触发。因为我们对用户的图片做了处理,已经无法再通过FileReference上传,只能通过URLLoader。这个安全性限制规定每次发起一个上传文件的URLLoader请求,都必须让用户点击一下鼠标才可以。如果用户选择了20张图片,就要点击20次鼠标。这显然是无法接受的。因此我们放弃了用标准文件上传,采用普通post形式。代价是失去了对上传进度的跟踪,不知道文件上传的百分比;同时服务器端也需要改造。
改变
最近,我们做了一个决定:开发一个类似功能的ActiveX控件,替代Flash作为图片上传的主要解决方案。ActiveX的优势是性能,不足之处在于只能在Windows+IE浏览器中使用,但实际上我们的Flash上传目前也只能在IE中使用。Flash真的适合像阿里巴巴这样的网站使用吗?闭源和性能是Flash最大的问题。但在HTML5被广泛支持前,Flash和传统Ajax还是我们最主要的富客户端应用开发技术,相对于ActiveX、Silverlight、JavaFX、Gear等技术来说,Flash还是有安装率优势的。目前Flash依然是我们很重要的RIA技术。
但是HTML5完全到来的那一天,现在很难说。


猜你喜欢
- tcp粘包产生的原因这里就不说了,因为大家能搜索TCP粘包的处理方法,想必大概对TCP粘包有了一定了解,所以我们直接从处理思路开始讲起tcp
- 分支结构的应用场景迄今为止,我们写的Python代码都是一条一条语句顺序执行,这种结构的代码我们称之为顺序结构。然而仅有顺序结构并不能解决所
- 问题你想反方向迭代一个序列解决方案使用内置的 reversed() 函数,比如:>>> a = [1, 2, 3, 4]&
- 1. 一个简单的字典我们先从写一个简单的字典示例开始,顺便看一下 python 字典的语法。student ={'姓名':&
- 1. 用Dreamweaver 4.0制作闪动的Flash按钮选择菜单Insert→Interactive Images→Flash But
- 什么是 PiniaPinia (西班牙语中的菠萝),本质上依然是一个状态管理的库,用于跨组件、页面进行状态共享.pinia 与 vuex 的
- 起步Pandas最初被作为金融数据分析工具而开发出来,因此 pandas 为时间序列分析提供了很好的支持。 Pandas 的名称来自于面板数
- 前言(结尾有彩蛋欧)目前,许多网站采取各种各样的措施来反爬虫,其中一个措施便是使用验证码。随着技术的发展,验证码的花样越来越多。验证码最初是
- 首先去官网下载两个架包链接如下:官网链接第一步:将两个架包解压到同一个database目录下。如截图所示:第二步:打开setup应用程序打开
- 前言如果你和我一样偶尔看看股票,看看自己关注的股票是涨了还是跌了,或者想快速获取到想看的头条新闻,我们不必把过多的注意力放在去寻找上面,我们
- 前言SQL SERVER 2012中新增了IIF函数,这个函数在VB或是ACCESS中是存在的。感兴趣的朋友们下面来一起学习学习吧。格式如下
- 咱们用的os模块,读取文件的时候,其实他是含有__enter__ __exit__ 。 一个是with触发的时候,一个是退出的时
- 正则表达式可以被看成是一个强大的通配符(通用匹配符号)。大多数人都应该很熟悉通配符,例如,当我们看到一个诸如“SAMS”的表达式
- Python慢的重要原因:1、python是动态性语言不是静态性语言在python程序执行的时候,编译器不知道变量的类型。2、python是
- 刚开始涉及到图像处理的时候,在opencv等库中总会看到mask这么一个参数,非常的不理解,在查询一系列资料之后,写下它们,以供翻阅。什么是
- 在大型的ASP项目中,很多的页面都涉及到分页、翻页功能。如果每个页面都写一个翻页的程序的话,这样的工作即降低了工作效率,也不利于工程的模块化
- 工欲善其事必先利其器,Python开发利器Pycharm常用快捷键以及配置如下,相信有了这些快捷键,你的开发会事半功倍一 常用快捷键编辑类:
- 前言首先是本文总体代码,改一下图像的读取路径就可以运行了,但我还是建议大家先看后面的步骤一行行敲代码,这样效果更好:""
- 以select为例,如果select写在循环里,触发change事件时可能不只需要传递被选中项的值,还要传递index过去,来改变同一循环中
- 本文实例讲述了php递归删除目录与文件的方法。分享给大家供大家参考。具体实现方法如下:<?phpfunction deldir($pa