Google Analytics(GA)在flash中的应用(转载)

如果你使用GA来监测和分析网站流量，你关注的是真实的访问和离开网站的数据，了解用户如何找到它，停留多长时间，等等。最近，GA小组发布了一个开源程序——本地应用的AS3 API，使你能够在RIA中使用（GA）进行跟踪情况。
     本文介绍了新近推出的谷歌对Flash的API分析跟踪器——gaforflash。内容包括下载、安装软件，介绍基本概念和术语，并展示如何使用组件和本地代码两种方法，包括记录基于Flex的RIA中用户活动的主要方法，以及关于它的局限性和实践性。
        这篇文章中的实例是用的gaforflash(vol1.0.1.319版)测试的。两个例子的源代码是：例1（源代码），例2（源代码）。注意，本文软件环境是Adobe Flex（Flex Builder 3，build 3.0.2）。
    GaForFlash是个开源类库。在能够检测到Event的js类库(ga.js)出现后，google认识到需要开发在本地执行的AS3类库。GA专家Nick Mihailovski介绍了项目的起源“We first got a group of 3rd party developers ........”
    下载网址：http://code.google.com/p/gaforflash。下载Zip包，将analytics.swc文件复制到项目的lib文件夹。

Page View vs.Event

    术语'page view'这个名字与RIA应用不大相称。但在GA中（常应用于HTML网页跟踪），'page view'就是GA分析的主要指标。下面这个例子是用组件来使用GaForFlash，从Flex内部发送'page view'数据到GA。


加载FlexTracker组件到Flex程序的代码。下面是它的4个属性：
id：这个属性允许FlexTracker被引用(第24行)
account：这个属性用来保存GA配置文件，该文件存储的数据是要向GA发送的。这是一个你(or客户端)可以控制的文件。
visualDebug：这个属性能打开GaForFlash的debug模式。没有events事件传输到GA的服务器，取而代之的是一个显示记录的窗口。
mode：这个布尔值能选择：AS3或是Bridge。Bridge模式是应用在网页内嵌入RIA。这种模式方便RIA的修改，例如，该网站的数据配置文件改变。Bridge模式是通过ExternalInterface使用的，所以对于RIA的嵌入代码中的allowScriptAccess参数的使用非常重要。AS3模式应用在相反的情况：RIA嵌在你不能控制的html页面中(如QQ空间中的小插件)，或是能控制页面但页面没有数据流量。

FlexTracker组件是应用trackPageview方法来监控流量的，这个方法唯一的一个参数是"URL"，这当然不是一个网址，而是一个RIA内部的逻辑视图的名称。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
	xmlns:mx="http://www.adobe.com/2006/mxml"
	layout="absolute"
	width="800" height="600"
	addedToStage="onComplete()" xmlns:components="com.google.analytics.components.*"
	>
	<mx:Script>
		<![CDATA[
			import com.google.analytics.GATracker;
			import com.google.analytics.AnalyticsTracker;
			
			
			private function onComplete():void
			{
				tracket .debug.minimizedOnStart =true;
				tracket.trackPageview("/panel1");
			}
			
			public function onButtonClick():void
			{
				tracket.trackPageview( "/hello/world" );
			}
			
		]]>
	</mx:Script>
	
	<components:FlexTracker id="tracket" account="UA-111-222"
							visualDebug="true" mode="AS3" />
	<mx:Accordion change="tracket.trackPageview('/panel'+String(event.newIndex+1));"
				  x="481" y="85" width="294" height="341">
		<mx:Canvas label="panel 1" width="100%" height="100%">
			<mx:Text text="Welcome to Panel 1"/>
		</mx:Canvas>
		<mx:Canvas label="Panel 2" width="100%" height="100%">
			<mx:Text text="Benvenuti a panle 2"/>
		</mx:Canvas>
		<mx:Canvas label="panel 3" width="100%" height="100%">
			<mx:Text text="Benvenuti a panel 3"/>
		</mx:Canvas>
		<mx:Canvas label="panel 4" width="100%" height="100%">
			<mx:Button label=" button" width="100%" height="100%" click="onButtonClick()"/>
			
		</mx:Canvas>
	</mx:Accordion>
	
</mx:Application>