| Subcribe via RSS

再谈：Flex程序如何获取html容器传递的URL参数值

04月 24th, 2008 Posted in ActionScript3, Flex3

在前面的一篇文章中我们讨论了利用Flex中的ExternalInterface类向swf传递参数。今天我们来谈谈另外一种更简捷的方法！

这次的方法是利用 SWFObject，SWFObject一个开源的JS模块，专门用来在HTML中嵌入Flash(*.swf)文件，利用该模块，使得插入Flash文件更加便捷、安全；并且使用SWFObject能自动检测各主流浏览器对Flash插件的支持并能作相应的处理。

目前SWFObject最新版为2.0，关于SWFObject的一些资源见下面：
官方站点
http://blog.deconcept.com/swfobject/

在google code的地址，这里有SWFObject 2.0的JS包及相关自动代码生成器的下载
http://code.google.com/p/swfobject/

SWFObject 2.0 官方文档（英文）
http://code.google.com/p/swfobject/wiki/SWFObject_2_0_documentation

SWFObject 2.0 官方文档（中文翻译）
http://farthinker.cn/2007/12/27/swfobject-2_0-doc-translation/

SWFObject 的使用非常简单，相信大家看了上面的文档就很清楚了，下面结合实例，谈谈利用SWFObject来获取URL参数值的做法。

我们的做法是，利用SWFObject的HTML容器代码自动产生器产生嵌入模板代码，点此处下载，注意在代码生成器中我们选定Publishing method（发布方式）为 Dynamic publishing（动态发布），编码设定为utf-8，关于静态发布与动态发布的详细介绍见官方文档。SWFObject 2.0 为开发人员提供了一些非常有用的函数，例如，我们要想获取*.html?name=JexChan&address=ChengDu这样的参数，就可以使用swfobject的getQueryParamValue函数，此函数可以直接获取以前面形式出现的get方式提交的参数值对，获取到参数值后赋给flashvars变量，最后再作为embedSWF方法的参数传递给相应的SWF文件。


包含SWF文件HTML容器代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
	<head>
		<title></title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<script type="text/javascript" src="swfobject.js"></script>
		<script type="text/javascript">
			var flashvars = {};
			//获取URL参数对值，并赋给flashvars变量
			if (swfobject.getQueryParamValue("name") && swfobject.getQueryParamValue("address")) {
 				flashvars.name = swfobject.getQueryParamValue("name");
 		 		flashvars.address= swfobject.getQueryParamValue("address");
			}
 
			var params = {};
			var attributes = {};
			attributes.id = "myContent";
			//将嵌入的SWF文件写入对应id的div中去，并向SWF文件传入相应的参数
			swfobject.embedSWF("GetParamSWFObj.swf", "myAlternativeContent", "1000", "500", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
		</script>
	</head>
	<body>
		<div id="myAlternativeContent">
			<a href="http://www.adobe.com/go/getflashplayer">
				<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
			</a>
		</div>
	</body>
</html>

通过SWFObject将SWF文件嵌入了HTML文件，那怎样在SWF文件中获取传过来的参数呢？在ActionScript3.0中，需要使用到LoaderInfo类，LoaderInfo类提供了被载入的SWF文件或其它图像文件（JPEG, GIF, 或 PNG）的相关信息。

要访问LoaderInfo对象有两种途径，如下图所示：

  • 通过flash.display.Loader对象contentLoaderInfo属性来访问
  • 通过显示对象（display object）的loaderInfo属性来访问

我们这里的SWF文件要想获取传递进来的参数，使用的是第二个途径，即显示对象的loaderInfo 属性来访问，这里的显示对象指根对象，可以使用stage，也可以使用root，它们在这里指向是同一个Stage（舞台），loaderInfo的parameters属性则包含了由外部向SWF传递进来的参数值对，它返回的值类型为Object。

我们这里仅使用了Flex生成出的SWF文件，而未使用Flex自动产生的HTML模板容器。

在Flex端的代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
	<![CDATA[
		private function clickHandler(evt:Event):void {
			//获取外部传给SWF文件的参数值对
			var obj:Object = stage.loaderInfo.parameters;
 
			if(obj.name != null && obj.address != null) {
				txtArea.text = "name: " + obj.name + "\n" 
								+ "address: " + obj.address;
			}
		}
	]]>
</mx:Script>
	<mx:Button y="96" label="GetParams" horizontalCenter="0" 
		click="clickHandler(event)"/>
	<mx:TextArea y="34" horizontalCenter="0" id="txtArea"/>
 
</mx:Application>

点击查看程序演示

Tags: , ,
This entry was posted on 星期四, 04月 24th, 2008 at 10:24 pm and is filed under ActionScript3, Flex3. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

One Response to “再谈：Flex程序如何获取html容器传递的URL参数值”

  1. 山芋 Says:

    12月 11th, 2009 at 7:46 pm

    谢谢提供教程，很受用。
    在自己实际操作中发现stage.loaderInfo.parameters在一些情况下会发生错误。
    flex中使用Application.application.parameters会更好一些。:)


Leave a Reply