这是一篇讲解如何使用 Fluorine 实现 Flash 与.NET 通信的入门级实例教程。通过本例的学习,我们将了解使用 Fluorine 开发 Flash RIAs 的基本流程。
Fluorine 简介
Fluorine 是一个开源的 .Net Flash Remoting 网关,支持 NET1.1 和.NET2.0,它的优势体现在开源和和对最新技术的支持。
其官方网站:http://fluorine.thesilentgroup.com/fluorine/index.html。
大家还记得 Adobe 的 Flash Remoting MX for .NET 吧。它是市面上最早推出的.NETFlash Remoting 网关,但它是商业软件,价格又比同类产品WebORB for .NET高出一倍。而且自从 2003 升级后再也没更新,更不用说支持 AMF3;相反,WebORB for .NET 却更新到 3.0 了,而且支持 AMF3。因此估计 Adobe 已经放弃 Flash Remoting MX for .NET 了。另一方面,.NET Flash Remoting 杀出一支新生开源的力量 Fluorine,它成长得很快,截至我写这篇教程时,已经推出 2.0.7.3.28 alpha,虽然是 alpha,但是运行已经很稳定,而且支持 AMF3。因此,它应该是目前开源.NET Flash Remoting 的最佳解决方案。
配置支持 Fluorine Remoting 的 Web 应用
本教程将详细介绍在.NET 环境下怎样配置支持 Flash Remoting 和 Flex 2 Remoting 的 Web 应用。包括使用模板和手工两种方式。
安装 Microsoft .NET Framework
Microsoft .NET Framework 为.NET 提供运行环境,是架构.NET 平台的基石。Microsoft .NET Framework 2.0 SDK 为开发人员提供.NET 提供软件开发工具包。为了运行数据库文件,可能还需要安装 Microsoft Data Access Components (MDAC) 2.8 SP1。它们都可以从http://msdn2.microsoft.com/zh-cn/default.aspx免费下载。请按介绍的顺序依次安装这些软件。
安装 Visual Studio 2005
这一步是可选的。没有 Visual Studio 2005 使用 SDK 也同样可以开发。Fluorine 对 Visual Studio 2005 和 Visual Studio 2003 都支持,不过最好使用 Visual Studio 2005,那样我们可以使用.NET 的许多新功能。要注意的是,Visual Studio 2005 速成版不支持 Fluorine 模板,要完全手动去配置 Web 应用。因此,最好是使用 Visual Studio 2005 团队版或者专业版。其中,Visual Studio 2005 的快速版是免费的,可以从 http://www.microsoft.com/china/msdn/express/下载安装。
安装 Fluorine Visual Studio Wizard
配置支持 Fluorine 的.Net Web 应用最简单的方式安装 Fluorine 模板,该模板目前只支持 Visual C# 和 Visual Basic,可以从http://fluorine.thesilentgroup.com/fluorine/download.html下载。安装时采用默认的就行了。安装路径下的文件夹如下图所示。
使用 Fluorine 模板配置 Web 应用
这里以 Visual Studio 2005(非速成版)为例。在安装有 Fluorine 模板的 Visual Web Developer 中, 选择 Fluorine ASP.NET Web application Template 模板。再设置好网站的位置,这里本地路径。接下来设置一种网站的语言,这里选择 Visual C#。如下图所示。
单击“确定”就创建了一个支持 Fluorine 的 Web 应用。在 Visual Web Developer 中打开 解决方案资源管器 ,我们将看到整个工程的结构。如下图。
与用 ASP.NET 模板生成的普通网站相比多出的文件在上图已经标明。其中 com.TheSilentGroup.Fluorine.dll、Gateway.aspx 和 web.config 是必不可少的。
由此可见,用 Fluorine 模板配置支持 Flash Remoting 和 Flex 2 Remoting 的 Web 应用是很方便的。
手动配置 Flash Remoting 的 Web 应用
如果我们的 IDE 不支持 Fluorine 模板,要想创建 Fluorine Flash Remoting 的 Flash Web 应用,就不得不手动添加它们。下面以 Visual Studio 2005 速成版为例介绍其详细步骤。
- 使用 ASP.NET 模板生成一个普通的网站。
- 选择工程文件,单击右键选择添加引用
.NET > Fluorine
,单击确定,将com.TheSilentGroup.Fluorine.dll
和log4net.dll
添加到Bin
文件夹中。 - 新增
Web.config
文件,将下述代码添加到<system.web>节点中。这样我们就将 Fluorine 服务器组件以模块的方式添加到 Web 应用中了。
<httpModules>
<add name="FluorineGateway" type="com.TheSilentGroup.Fluorine.FluorineGateway,com.TheSilentGroup.Fluorine" />
</httpModules>
- 新增
Gateway.aspx
,它是一个空白的 Web 窗体, 网关会指向它。
好了,一个支持 AMF0 的 Web 应用就配置好了
手动配置支持 Flex2 Remoting 的 Web 应用
前面的配置只适用于 Flash 平台,如果要适用于 Flex 2 平台,要能支持 AMF3,还得添加 Flex 2 Remoting 服务配置文件。具体步骤如下:
- 在 Web 应用根目录
\WEB-INF\flex
下添加services-config.xml
文件。
<?xml version="1.0" encoding="UTF-8"?>
<services-config>
<services>
<service id="remoting-service"
class="flex.messaging.services.RemotingService"
messageTypes="flex.messaging.messages.RemotingMessage">
<destination id="fluorine">
<channels>
<channel ref="my-amf"/>
</channels>
<properties>
<source> *</source>
</properties>
</destination>
</service>
</services>
<security>
<login-command class="com.TheSilentGroup.Fluorine.Messaging.Security.GenericLoginCommand" server="asp.net"/>
</security>
<channels>
<channel-definition id="my-amf" class="mx.messaging.channels.AMFChannel">
<endpoint uri=http://{server.name}:{server.port}/{context.root}/Gateway.aspx class="flex.messaging.endpoints.AMFEndpoint"/>
</channel-definition>
</channels>
</services-config>
- 打开
services-config.xml
,添加如下代码。
好了,一个支持 Flash Remoting(AMF0)又支持 Flex2 Remoting(AMF3)的 Web 应用就配置好了。
建议:
- 指定端口 ASP.NET Development Server。默认下该 Web 应用使用的是动态端口中,为便于讲述,请设置 使用动态端口 的属性为 false,端口号为 8088。这样使用 http://localhost:8088/flashservices/Gateway.aspx 就可以指向网关 URL 了。
- 配置远程服务浏览器,这样可以方便开发。还有就是设置日志,这样可以方便测试维护。具体细节就不详谈了。
使用 Fluorine 实现 Flash 与.NET 通信
ASP.NET 服务可以用任何支持公共语言运行库(Common Language Runtime,简称 CLR)的编程语言来开发,目前 Fluorine Remoting 可以用 Visual C#或 Visual Basic 来实现。在本例中,我们将使用一个简单的 CS 类来实现 HelloWorld 远程服务。代码如下:
using System;
using com.TheSilentGroup.Fluorine;
namespace tutorials.remoting
{
[RemotingService()]
public class HelloWorld
{
public string sayHello(string userName)
{
return '您好,' + userName + '。这是来自 Fluorine Flash Remoting 的问候';
}
}
}
RemotingService 属性并不是必需的,不过使用该属性,在配置了服务浏览器的 Web 应用上可以通过 Console.aspx 查看远程服务类文件及调用该服务 的 ActionScrip,该浏览器的功能与 Amfphp 的服务浏览器的功能相似。如下图所示。
在 Web 应用根路径下添加 App_Cod 文件夹,将上述代码保存为 HelloWorld.cs 并放到该文件夹中,.NET Framework 2.0 会动态编译该类。如果我们安 装的是 Visual Studio 2003,访问类前你得编译整个应用项目,Visual Studio 2003 会将整个应用项目编译一个 dll(程序集)文件。如果我们安装的是.NET Framework SDK 1.1,还得手动将 HelloWorld.cs 编辑成库 dll 文件,然后将 dll 文件剪切到 bin 文件夹中。
返回到 Flash,注释掉其它版本的网关 URL 所用的代码。单击按钮测试,你将收到来自 Fluorine Flash Remoting 的问候。
ActionScript 的代码是一样的,点击了解详情。
使用 Fluorine 实现 Flex 与.NET 通信
如果你对 Flash Remoting 与 Flex 之间的数据交换没有什么 idea,请先看一看这篇文章:使用 Flash Remoting 实现 Flash 与 ColdFusion 通信。
Fluorine 也支持 AFM3,这就意味着我们可以利用 RemoteObject 来实现 Flex 与.NET 的通信。但与 ColdFusion 不同的是,ColdFusion 的 Flex2 网关已经设置好了(如果使用内置安装方式的话)。
客户端
接下来我们同样用 Flex Builder 来用创建本实例所用的简单 Flex 应用。详细步骤如下:
- 打开 Flex Builder,选择
File > New > Flex Project > Flex Data Services
。如下图,默认情况下,选项一将在 Flash Bulider 的本地工作空间创建工程,选项二将在服务器上下文根(路径)下创建工程。我们选择第一种方案,将 Flex 工程保存在客户端,而.NET 工程则保存在服务器端。
- 单击 Next,因为我们没有安装 Flex Data Services,请取消 Use dafault local Flex Data Services location 选项。浏览选择 Web 应用的根目录,输入根 URL 路径,在上下文根(路径)中填写 Web 应用的虚拟路径。如下图。
- 单击 Next,设置工程名称(如 remoting),工程路径默认不变。
- 修改工程主文件名称(如 HelloWorld),设置输出文件的路径(如下图)。单击 Finish 完成工程的创建。
最后这两步和在 Flex Builder 中设置 ColdFusion Flash Remoting 是一样的,请参考使用 Flash Remoting 实现 Flash 与 ColdFusion 通信。
编写客户端代码:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
<mx:RemoteObject id="service" destination="fluorine"
source="tutorials.remoting.HelloWorld" showBusyCursor="true" />
<mx:TextInput id="txtName"/>
<mx:Button label="Say Hello" click="service.sayHello(txtName.text)"/>
<mx:Label text="{service.sayHello.lastResult}" fontSize="18"/>
</mx:Application>
各 ColdFusion 版的实例相比,只是 destination 属性由 ColdFusion 变成了 Fluorine,简单吧?
Flex Builder 3 下使用 Fluorine
Flex Builder 2 的 Flex 工程可以直接 Flex Builder 3 下编译。如果要新建一个支持 Fluorine 的网络应用就要麻烦些,因为 Flex Builder 3 中没有 Flex Data Services 选项。 不过,Abode 为了推 ColdFusion,始终会保留 ColdFusion Flash Remoting 的。既然其它 Flash Remoting 都是向 ColdFusion Flash Remoting 看齐,因此 完全可以使用向导配置其它 Flash Remoting。具体步骤如下:
- 新建 Flex 工程。选择
ColdFusion Flash Remoting
。如图:
- 配置服务器。选择
Deployed to J2EE server
。如图:
注意:不能选第一项,除非你的电脑安装了 ColdFusion。其它步骤见使用 Fluorine 实现 Flex 与.NET 通信。
本方法也适用于 Amfphp 及其它 Flash Remoting。点击此处下载 Felx Builder 3 + Fluorine 工程文件。
服务器端
服务器端还是利用前文的.NET 服务。
Fluorine 下 Flex Web 应用的远端部署
大家都知道,我们一般使用的是租用的虚拟主机,一般没有权力将 IIS 中虚拟目录配置为应用程序,因此 Gateway 只能放在虚拟主机 Web 应用的根目录下。这就是我唯一不喜欢 Fluorine 的地方,这不能怪 Fluorine,部署其它.NET 应用时也有这个问题。
正因如此,我们在配置 Flex+Fluorine Remoting 项目时,Root URL 只能虚拟主机域名或 http://localhost:80,也就意味着我们只能在本地默认网站(localhost)80 端口下开发 Flex 应用了。万一 80
端口被其它 Web 应用占用了,那么又该怎么办?用虚拟目录是行不通的,可以使用 ASP.NET Development Server,将 Output folder URL 设置成 localhost: 其它端口+放置 swf 的子文件夹,然后就可以通过 Output folder URL
正确播放本地端的 swf 电影,同时通过 Root URL 也可以正确播放虚拟主机端的 swf 电影。其实这和 Flash Remoting 环境下 Flash RIA 部署差不多,我们可以在网页中通过使用 flashvars 来设定网关连接,这样部署起来就方便多了,不过不安全。
小结一下,我的建议就是 Root URL 设置为外网域名或 http://localhost:80,这样可以方便外网部署;Output folder URL 设置成 localhost: 其它端口+放置 swf 的子文件夹,这样可以方便我们在本机上开发调试。
注意:
- FluorineFX 中有所改进,Root URL 的端口可以不是
80
,也可以不用指定Output folder URL
了。- 如果修改了
config.xml
文件记得重启服务器
数据类型转换
Fluorine 的官方帮助是以 AMF0 和 AMF3 两个版本来讲解 Flex ActionScript 3.0(以 下简称 AS3)与 Fluorine .NET 之间(以下简称.NET)的数据类型转换的,此处我们仅以 AMF3 版本来介绍。几种数据类型转换方式中最方便的应该是 Flex AS3 自定义对象转换为.NET 值对象。
AS3 数据类型成 Fluorine 数据类型
- 基本类型的数据
比如说我们用一个方法要向服务器端发送一个人的基本信息:比如姓名、年龄和婚姻状况,可以简单地把姓名、年龄和婚姻状况作为该方法的参数传递。参数的个数及前后位置要和.Net 对应,参数一多,很容易出错。而且很多时候还需要用.Net 再次转换。此类数据转换基本上是一一对应,和 HTTP Service 和 Web Service 差不多,体现不了 Remoting Service 技术的优势。请参看源文件中的 sendArgs 方法。
- 数组类型
同样是上述情形,如果改用数组为参数,方法会看起来简洁很多。不过仍然数组的元素的前后位置也必须与服务器端一致。AS3 数组通 过 Fluorine 转换为.NET 的 IList 接口数据类型,详情请参看 sendArray 方法。
- 关联数组类型
联数组其实就是 Object 对象,它可以让我们动态添加属性。参数变成了 Object 对象的属性,再将 Object 对象高级参数传递,再也不用担心 AS3 与.Net 文件中方法的参数个数及顺序必须一致了。AS3 关联数组通过 Fluorine 转换为.NET 的 Hashtable,请参看 AssoArray 方法。
- VO 数据类型
再通过 Fluorine,我们可以将 ActionScript 自定义对象(如 Person.as)转换为.NET 的值对象(VO)(如 Person.cs),从而实现 AS3 与.NET 的 Mapping(映 射)。如 sendVO 方法,这两个类的类名可以不一样,属性名和属性个数都可以不一样(为了好记,最好相同)。实现映射有以下两种方法:
- 在 ActionScript 类中注册类的别名。使用
RemoteClass(alias=".Net 全限定类名")
; - 在 web.config 文件中添加
classMappings
节点。
<classMappings>
<classMapping>
<type>.Net 全限定名</type>
<customClass>AS3 全限定类名</customClass>
</classMapping>
</classMappings>
在某些情况下第一种方法失效,可以尝试第二种方法。很显然,用值对象向.NET 传递数据是最方便的。
当然还有 ByteArray 数据类型也是很重要的,比如说常见的大头拍应用,传统的方法在服务器端进行二进制编码,很麻烦效率也很差。如果用 Fluorine 对 AS3 和.NET 都直接使用 ByteArray 数据类型,那就方便高效多了。
点击此处下载源码。
Fluorine 数据类型转换成 AS3 数据类型
当然 Flex ActionScript 3.0(以下简称 AS3)与 Fluorine .NET(以下简称.NET)之间的数据转换是双向的。比如在前面的示例我们用一个方法要向.Net 发送一个人的基本信息,最后以字符的形式将结果返回 Flash player。复杂一点的话,会先 Flash Player 该条数据添加到数据库中再返回一个数据集,当点击某条记录时再返回该记录的详细数据。这都会涉及到 AS3 与.NET 之间的数据交换。这次我们讲解怎样将.NET 数据类型转换成 AS3 数据类型。
由于.NET 支持的数据类型很丰富,因此这种转换更多也更有价值。
- 数组类型
在 AS3 中,数组元素的数据类型可以不一样。但.Net 对数组类型的强性限制。因此本实例不适合用这种方法。
- IList 非泛型/泛型
原理就是通过 ArrayList 类或 Object 类来实现 IList 非泛型/泛型接口,从而实现它们转换成 AS3 数组类型,请参看 getList 和 getGenericList 方法。
- IDictionary 非通用/泛型
我们可以通过 Hashtable/ASObject 类或 Object 类来实现 IDictionary 非通用/泛型接口,从而实现它们转换成 AS3 关联数组/Object 类型,请参看 getAssoArray
、 getDictionary
、getGenericDic
和 getASObjec
方法。
- VO 数据类型
既然是映射,.NET 值对象也可以很方便地转换为 AS3 自定义对象,具体请参看 getVO 方法和上一回讲解内容。
- 数据集/表
使用 Fluorine 可以将.Net 数据集/表转换成 AS3 的 DataTable 对象(ASObject)/关联 DataTable 对象数组(ASObject)/,方便地为 ComboBox、DataGrid、List、TreeList 和 TileList 等组件提供数据源,这才真正体现 Remoting Service 技术的优势。我们甚至可以在方法外部添加元数据标签,如[DataTableType(string remoteClass)],从而指定 DataTable 的数据类型。表每一行被序列化成一个值对象(VO),各列名称就是该值对象名称。
注意:Flash Remoting AS2 中的 RecordSet 已经被 Flex AS3 的 ArrayCollection 取代。
相关资源:
使用 Flash Remoting 发送 SMTP 邮件
这是我早期的一个练习作品,主要是学习 Fluorine 与 Flash 之间的数据类型转换。分别有简单数据数据类型、数组数据类型、关联数组数据类型,对象数据类型作为参数进行练习。当然,肯定用对象数据类型作为参数传递最强。
至于服务器端,我想很多人发送 SMTP 邮件时都没有自己的 Email 服务器,因此不得不借助于 163、新浪这些网站的 Email 服务器,他们为防止一些别有用心的人利用他们的服务器以垃圾邮件,因而对 SMTP 邮件都要进行严格的验证。因此,我们要 借鸡下蛋 还得费点心思。如果用 Java、PHP 这些后台,得用 Socket。ColdFusion 最方便,基本上不受限制。当然,用.NET 也算方便。如果是基于.NET Framework 1.1 框架,可用 Web.Mail 类库来实现,只要通过 microsoft 的 SMTP 邮件 schemas 验证就可以了。如果是用.NET Framework 2 框架来开发,可以使用新增的 Net.Mail 包。用法很简单,而且还可以实现异步发送。
注意:
- 我是通过 web.config 设置发信人邮箱的。发送邮件前请设置好收信人邮箱,收信服务器和端口。
- 目前测试通过的有 163、新浪邮箱,其它邮箱测试没测试,欢迎大家帮忙测试一下。
- 本程序是基于 Flash player 7.0,暂时没有发送附件的功能。
点击此处下载源文件及工程文件。
使用 Fluorine 实现 Flash 分页显示
Fluorine 的帮助文件介绍了怎样使用 Fluorine 实现 Flash 分页显示,但数据库是 MySQL,若是 Access 怎么办?Luar 介绍过一种方法,但难以理解。本文以 Fluorine 为例,介绍一种简单方法来实现 Flash 分页显示。
Flash Remoting 的 pageable recordset 技术简单地说,就是利用 Flash Remoting 在 Flash 中实现数据集的分页显示。其中 ColdFusion 和 J2EE Flash Remoting 的功能最强。它们能实现边拖动 List 类组件边载入数据的功能,开源的 Flash Remoting 目前还做不到这一点。Fluorine 的 pageable recordset 技术和 Amfphp 的类似,它的帮助文件有简单介绍。但该实例使用的数据库是 MySQL,若是 Access 怎么办?Luar 在他的 Flash MX 2004......一书中利用 Abode 的.NET Flash Remoting 实现了 Flash 分页显示。不过他介绍的 Top 算法很多人都难以理解,而且还需要在 Flash 中对最后一页作额外处理,有些麻烦。我这里介绍一种简单的方法。
我是通过 OleDbDataAdapter 对象 Fill 方法实现的。代码如下:
至于客户端代码我就不说了,想了解的请参考源文件。
下面的资源有助于理解 pageable recordset:
利用 FluorineFx 生成 Cairngorm 代码
FluorineFx 已经安装好久了,一直没空学习。今天抽空体验了一下新功能,居然发现 FluorineFx 也支持代码生成了。
注意:FluorineFX 是 Fluorine 升级版。
Cairngorm HelloWorld中我已经给大家介绍过两种 Cairngorm 代码生成工具。今天发现使用 FluorineFx 的 Service Browser 已经可以自动生成 Cairngorm 代码了,高兴呀。
在 Service 树形菜单中选择一个服务方法,如下图。
在其右侧的浏览面板中选择 Code generator,目前只有两种模板可以选择,如下图。
最后点击 “Download” 按钮将模板下载到本地使用。爽吧!以前 FluorineFx 学 PHPAMF,现在开始学 Weborb 了!
目前只能一下子生成所有服务的代码,希望以后能改进一下。
使用 FluorineFX Cosole 测试 Flash Remoting
FluorineFX 改进了 Cosole 控制台,其中重点改进了 Service Browser 的功能,其功能目前已经超越了 PhpAmf,更像是 Weborb。上一次我们简单谈了一下 Service Browser 的代码生成功能,这回说一说它的调试功能。
- 打开 FluorineFX Cosole,如:http://localhost:8088/Fluorine.aspx
- 在 Service 树形菜单中单击选择一个服务方法。
- 右侧浏览面板 Test 选项卡上方的操作窗格会显示远程服务的类名、类全限定名、方法名、参数输入框(如果有参数)和 Call 按钮。如下图。
注意:
- 如果参数是原始数据类型,按顺序按类型输入即可;
- 如果参数是索引数组,直接输入即可,如["F",26,false];
- 如果参数是关联数组或 Object 对象,应该使用 Json 字符串格式,如
{"name":"F","age":26,"married":false}
。 - 如果参数是值对象(VO),目前还没办法测试。
四、输入远程服务方法参数,点击“Call”,如果输入正确就可以看到其下方输出窗格中的测试结果。默认下使用的是“Results”选项卡,其内容对应 Flex Bulider 调试模式下的变量窗口中的 result 变量;Tree view 适合显示结果是 XMLList 对象,而 RecordSet view 适合显示结果是 RecordSet(AMF0)或 ArrayCollection 对象。
当然了,使用 FluorineFX Cosole 只能简单测试 Flash Remoting,最好是使用 Flex Bulider 结合 VS 调试。见帮助
http://www.fluorinefx.com/docs/fluorine/vsdebug20.html
FluorineFX+Flex 实现简单公聊
FluorineFx 可以说是一个小型的 LCDS,部分实现了 Flex Messaging 和 Flex Data Services 功能,可以使用 LCDS 才支持的 Flex 标签,如 <mx:Consumer>
,<mx:Producer>
等。以前我们做 Flash IM 程序,一般要用 FMS 或 Socket 作为数据驱动,现在可以用直接用 FluorineFx 完成类似任务,FluorineFx 是开源免费的。
功能:用户用任意用户名和密码登录,然后在公共区聊天,相对于官方程序新增用户选择文字颜色的功能。
注意:在编译该源代码的 Flex 程序时,记得将 fds.swc
加入到库路径中。
点击此处下载本实例的源码。
评论 (0)