2.0里的1.0

2006年10月11日, 23:02:55

有个常用的Web功能,很难2.0化,它就是文件上传(File upload)。File upload是个标准的1.0样式的功能,由于要访问本地文件系统,什么JavaScript,Flash都很难做处理,做的好点就是hacking一下,效果模仿接近2.0一点,根本上说还是笨拙的。

在不使用无安全级别限制的重量级插件的情况下,全凭现有的W3C规范,突破这个瓶颈着实有点困难,更不要说提供上传进度监视等高级功能了。

我还没有仔细阅读过W3C的这个新的draft spec,不难看出有越来越多的人正在考虑优雅的解决这个问题,尽可能达到比较完美的2.0高度。

4 Responses to “2.0里的1.0”

  1. Jove Says:

    October 13th, 2006 at 1:53 pm

    几个我知道做的不错的Web 2.0 style file upload:
    * www.box.net 经典的网络存储。听说近期不能免费注册了。可以选择多个本地文件,一起上传,并看到每个的进度。没有明显Flash/Applet的迹象
    * Google, google的很多服务如gmail, google pages都可以很方便的上传文件,选定文件后他就在后台慢慢upload
    * goowy.com, 一个用纯Flash制作的webtop. 他实现了一份Flash版的Box.net上传UI。可以监控上传进度或取消队列中尚未开始传送的文件

    其实Web2.0的应用不一定非要用网页做,想Google docs这样,你可以往一个特殊的email地址发送文件,附件或正文自动就成为在线文档。这也非常符合2.0那种Open API, Open Data的概念。

  2. Jove Says:

    October 13th, 2006 at 2:17 pm

    更正一下,看了一下box.net的代码,他其实借用了Flash8之后新引入的文件上传类.

    在页面上放一些层,指定一个ID

    然后插入一个width=height=0的Flash movie:
    http://www.box.net/static/flash/upload_new.swf

    这个Flash与页面JS通讯,并把上传进度更新给页面div
    function exportProgress() {
    var _local1 = new Array ();
    _local1[0] = totalBytesLoaded;
    _local1[1] = totalBytesTotal;
    res = String (flash.external.ExternalInterface.call(”setProgress”, _local1));
    }

    var listener = new Object ();
    。。
    listener.onProgress = function (file, bytesLoaded, bytesTotal) {
    setTotalBytesLoaded(file, bytesLoaded);
    exportProgress();
    };
    ..
    var fileRef = (new flash.net.FileReferenceList());
    fileRef.addListener(listener);

    flash.external.ExternalInterface.addCallback(”removeFile”, null, methodRF);
    flash.external.ExternalInterface.addCallback(”uploadFiles”, null, methodU);
    flash.external.ExternalInterface.addCallback(”clearFileList”, null, methodCFL);
    flash.external.ExternalInterface.addCallback(”browse”, null, methodB);
    flash.external.ExternalInterface.addCallback(”cancelUpload”, null, methodCU);

  3. Zhang Ling Says:

    October 13th, 2006 at 4:11 pm

    不错的资源。我对Web file upload感觉是整个过程不robust,像走钢丝,用non-web client的方法集成性弱了点,但稳定很多,实用。

  4. Peter Says:

    October 25th, 2006 at 9:35 pm

    试试这个网站, http://filesfly.com/ . try to upload a file, 然后你就会看见一个很棒的对上传进度的监控.

Leave a Reply