用firebug来调试actionscript

往常调试actionscript,是用的trace,在flash debug player里头输出变量内容。今天看到的方法比较有趣,是利用javascript在firebug中输出as的调试信息。

用firebug调试as的基本原理

ExternalInterface.call('console.log', "string is [%s]",  "abcde");

利用as的ExternalInterface和js交互,然后调用firebug的console.log,将as的变量输出到控制台,这样也能达到调试的目的。

当然,要使用firebug,前提当然是你使用的firefox浏览器。如果是ie,那么只好使用alert弹出信息。

用来调试flash的air应用

看到一个名为Arthropodair应用,可以用来记录flash的log信息,并以颜色区分。如果你采用Flash CS3创建了一个air应用,那么它的trace命令不会生效,这样对调试是很不方便的。

这个时候Arthropod就显得很有用。

用法

  • 在actionscript中导入Debug类:
    import com.carlcalderon.arthropod.Debug;
  • 输出debug信息
    Debug.log("My log message");
  • 然后启动arthropod

arthropod

我也试用YUI Uploader

早就知道YUI里面有Uploader这么一个上传组件,可以按住ctrl多选文件上传(就像flickr那样的上传),并且可以支持进度条,这样对用户来说是相当方便的。

由于YUI Uploader是利用javascript + flash实现的,所以用户的浏览器上只要有flash player就可以使用,也不需要额外安装别的插件了,这显然也是YUI Uploader的一大优势。

我的YUI Uploader试用之旅

  • 首先下载Uploader批量上传页的html源文件
  • 解压后放置在你的web服务器上,比如我就是在自己的台式机上安装了一个xampp
  • 现在需要一个处理上传操作的后端程序,在这里我是用php简单的写了一个,如果你用别的语言也是不成问题的。在uploader-advanced-source.html的同一目录下放置upload.php,源文件如下:
    foreach ($_FILES as $fieldName => $file) { 
    	$name = md5(microtime());
    	move_uploaded_file($file['tmp_name'], "./" . $name . '.jpg'); 
    	echo $fieldName . ' uploaded!';
    }
  • 下载http://yui.yahooapis.com/2.5.1/build/uploader/assets/uploader.swf,然后把uploader.swf放在和upload.php的同一目录下,这是为了避免javascript和flash交互过程中出现跨域问题。
  • 修改uploader-advanced-source.html
    • 把”YOUR UPLOAD URL GOES HERE”替换成你的upload.php所在的url,比如我的就是http://localhost/yui/upload.php
    • 把YAHOO.widget.Uploader.SWFURL修改成你的uploader.swf实际url
  • 现在访问uploader-advanced-source.html,试试批量上传功能吧

试用的一点补充

  • 这个例子里面的php源文件只是考虑上传n张jpg文件的情况,可根据实际情况调整。
  • 上传后的文件名是md5随机加密的,在upload.php同一目录可见
  • 由于flash的bug,运行在windows下的firefox无法正确获得flash传递过来的cookie,如果上传应用对cookie有依赖,可能会需要做额外的处理。
  • 为了能够确切的显示上传进度条,可能需要php 5.2的apc扩展支持
  • 上传进度由flash完成
  • YUI 2.5.2已经附上uploader.swf的actionscript,有一定的学习价值

贴一张Uploader使用效果图

用AIR生成土豆豆单批量下载清单

把之前的greasemonkey脚本又加工了一下,这次改用air做了一个桌面小工具,功能完全一样,可以生成土豆的豆单批量下载清单,有所改进的是,能够生成中文的下载文件,这样下载回来就可以连续观看而不用费事去查了。

使用方法

  • 首先下载安装air runtime
  • 下载flvMaster.air,文件很小,只有29k
  • 双击flvMaster.air即可呼出air的安装界面,进一步安装
  • 界面非常简单,在url输入框里输入豆单的播放url,然后点击search按钮,这样就会在下面的输入框中生成豆单的下载清单
  • 接下来点击save按钮就可以保存下载清单到桌面了,保存的文件名最好以lst做后缀
  • 可以用flashget来导入下载清单并批量下载flv视频

用air来写这种小工具真的是非常方便,一点点html+javascript代码就可以完成很实用的功能,尤其是ajax操作,完全没有跨域限制,很强大。

贴一张运行时的界面图

补充

Air现在发布了1.1中文版,国内用户也可以享受到中文界面的Air了。

CachegrindVisualizer

CachegrindVisualizer是一个xdebug的profile文件查看客户端,采用Adobe的AIR制作,很让人惊讶,因为目前我看到的采用AIR制作的软件少的可怜.

与CachegrindVisualizer具有类似功能的软件还有wincachegrind,相比之下,wincachegrind的功能更为强大,使用上也更方便.但是即便如此,我还是乐见CachegrindVisualizer发展的更好.

CachegrindVisualizer支持的操作系统

Windows 2000 SP4, Windows XP SP2, Windows Vista Home and Ultimate Edition, Mac OS 10.4.7 and above (Intel and PowerPC), Mac OS X Leopard.

运行时的抓图

CachegrindVisualizer

相关连接

Ajax Vs Flash

在RIA应用中,到底应该使用Ajax,还是使用Flash呢?它们各有长处,让人难以取舍.下面就它们的特点做一个小小的总结.

    Javascript

  • + 不需要额外的插件.
  • – 不同的浏览器下可能会产生不同的行为
  • – 不能访问音视频设备
  • – 可能会有少数用户会关闭javascript
  • – 如果你写的代码很烂,大家都能看到

    Flash

  • – 需要额外安装插件
  • + 在各种浏览器上,如果flash player的版本一致,那么flash的行为也会基本一致
  • – 用户可能不会安装有相同版本的flash player
  • + 可以直接访问音视频设备
  • – 可能会有很多用户屏蔽flash
  • + 如果你写的代码很烂,不用担心,大家都看不到

关于Flash LoadVars的常识

Flash player通过loadVars的各种方法发出去的请求,能够继承浏览器的cookie,它并不独立。因此,某些需要cookie认证才能访问的接口url,也是能够直接用Flash发出请求直接调用的——这阵子费了好大功夫才明白这个常识性问题。

flash和javascript之间的交互 —— ExternalInterface

版权声明:可以任意转载,转载时请务必以超链接形式标明文章原始出处和作者信息及本声明

最近做一个应用,flash和javascript之间互有调用。最后一次写点Actionscript也是在flash 7的时候了,因此按照我的想法,只要用fscommand和getUrl(“javasciprt:…….”)这种形式,flash和javascript之间互相调用应该不是什么大问题。

没多久就开始觉着自己落后了,Flash 8早已经新增了ExternalInterface API专门处理flash与外部应用的交互,只要浏览器装有flash player,支持的范围应是更广。

ExternalInterface class能够运行的环境

  • Internet Explorer for Windows (5.0 and later)
  • Firefox 1.0 and later
  • Mozilla 1.7.5 and later
  • Netscape 8.0 and later
  • Safari 1.3 and later.

使用心得

ExternalInterface class仅仅只有两个方法:

Continue reading “flash和javascript之间的交互 —— ExternalInterface”

用javascript实现的socket客户端

javascript实现的socket客户端?没错,而且不依赖java applet之类的作弊手段.这里有个例子:socketjs.它的巧妙之处是在页面中内嵌入了一个大概300字节的flash,利用javascript来操纵flash的xmlSocket client,这样就实现了一个伪socket客户端。在flash和javascript结合的越来越紧密的今天,我们已经看到许多这样类似的应用。我们可以利用这个socketJs来实现一些多人的基于web的即时通讯程序如聊天室,互动游戏之类的。

socketJs目前有如下可调用的api

function SocketConnect(host,port){} 
function SocketSend(data){} 
function SocketClose(){} 
function SocketOnInit(){} 
function SocketOnConnect(success){} 
function SocketOnData(data){} 
function SocketOnClose(){} 

注意要点