轻松搞定deeplinking 和 analytics

60 篇文章 0 订阅

大家普遍认为在flashflex应用程序游戏中,很难应用深层链接(Deep Linking)和分析数据的收集,幸运的是没有什么是不可能的,这两个仅用几行代码就能实现。

这篇文章将涉及到什么是SWFAddress,什么是Google Analytics?我们为什么要使用他们?最重要的是我们如何放到我们的应用程序中去。

我在2010年9月19-21日写过360Flex conference in Washington DC这篇文章,我认为他适合用SWFAddress和GoogleAnalytics建立一个custom slide viewer,在这上面点击右键可以看到源码

注意:移动鼠标到应用程序的左边会出现导航,或者按住鼠标并拖动向前或向后翻页。也支持触摸事件

当点击左边的按钮,注意看地址栏的URL和页面的标题也跟着变化,应用程序也发送了数据给Google Analytics。在这页的底部(文章的最后)我建立了一个Google帐号任何人可以登录查看收集幻灯片的分析数据。从Google Analytics的面板你可以看到访客数据,浏览的页面,和停留在网站上的时间,以及一个地图覆盖图。

为什么要使用深度链接(deeplinking)
不是每一个Flex 应用程序都需要深度链接,但是对于许多人来说这增加了用户体验的功能UX ( User eXperience ),这花费我们小小的努力是值得的。考虑这个例子,我的网站RunPee.com一个告诉人们在电影播放中最适合上厕所的时间的网站(译者注:以下简称“尿点”(peetimes)就是电影中最无聊的部分),这个网站非常简单,有一个用户所选的电影中最适合上厕所的时间的电影导航,假设你想要告诉你的朋友《盗梦空间》Inception的“尿点”或者发送《盗梦空间》Inception的“尿点”到tweent上,如果没有SWFAddress你只能发送主页并且期望他们在主页上找的盗梦空间的导航。但是自从我在网站上用了SWFAddress你就可以发送《盗梦空间》的地址了例如:http://runpee.com/#/Inception-region-US-lang-EN-key-121.也可以为你的应用程序添加向前向后,刷新和收藏的功能,这些正是FLEX和Flash所缺乏的。
注意:如果你使用SWFAddress你可以给它的开发团队一些赞助Asual's donation bucket to say thanks.

为什么要使用Google Analytics
当然如果你想知道多少人使用了你的应用程序,你可以在包含你的应用程序的HTML中加入Google Analytics的 Javascript代码,但是它只给出了主页上的数据.你不可能真正有多少人使用了你的应用程序,除非你跟踪到你的Actionscript代码。

Google Analytics 在html网站上的运行是通过google每次更新服务器从网站载入页面。在flex应用程序上这有点困难。你必须告诉google服务器当前页面和每次的刷新。现在好了,你可以完全去控制你想要跟踪的,某人在观看视频时,你可以为一个实例添加跟踪,没十秒就ping一次google服务器,这样你就知道这个人在离开之前看了多长时间。或者假设你跟踪一个游戏,查看人们玩到多少级就放弃了。这样你就可以知道你的游戏对人们来说是否太难了。
.
你也可以得到任何格式的页面浏览量数据。你发送一串数据数据到google无论什么格式的。在这个跟踪视频的例子里,我发送"/name-My Video Name-seconds-40-213"给google,有视频的名字,用户观看的秒数和视频总秒数。当我查看google上的数据时,我可以过滤和分类我想要看到的信息。

另一个分析数据的原因是可以知道这个国家有多少用户在使用你的应用程序。例如;如果你有个游戏发现在中国非常流行,你就可以考虑是否将它翻译成中文的让你的游戏在当地更流行。如果你打算让你的应用程序是多语言版本的,那么你可以使用跟踪来优先翻译那个语言.
你也可以得到用户的硬件信息,如播放器版本,浏览器类型,屏幕分辨率,操作系统,所有的这些数据都是你的应用程序更新的参考。
注意:这个例子是FLex的SWFAddress and Google Analytics能在纯Actionscript上工作的更好。

SWFAddress是如何工作的?
首先你要下载它SWFAddress code from Asual.com,他是免费开源的,然后将swc放到项目中的libs文件夹中,另外swfaddress.js要放到你的服务器上并通过HTML载入。
你要更新你的flex项目中的index.template.html文件,载入js文件。代码行载入swfobject.js才正常运转,所以你的HTML代码如下:

  1. <script type="text/javascript" src="swfobject.js"></script>
  2. <script type="text/javascript" src="swfaddress.js"></script>
复制代码
关于SWFAddress的几个事情:
1.SWFAddress是静态类,不需要实例化。
2.为了知道SWFAddress什么时候改变,你需要增加一个监听,但是你只能增加一个监听,更确切的说,你可以增加很多监听但是只有最后加入那个工作。

下面为你的应用程序加入SWFAddress.CHANGE监听事件:
  1. SWFAddress.addEventListener( SWFAddressEvent.CHANGE, onSWFAddressChange );
复制代码
处理监听事件
  1. private function onSWFAddressChange( e:SWFAddressEvent ):void {
  2.         if( SWFAddress.getPath() == "/" ) {
  3.                   // set view to homepage
  4.           } else if( SWFAddress.getPath().indexOf( 'something_' ) != -1 ) {
  5.                   // set view to something
  6.           }
  7. }
复制代码
最后当你改变URL时,你必须写下这个:
  1. SWFAddress.setValue( 'something' );
复制代码
你可以在你的应用程序的任何地方告诉SWFAddress改变了链接(URL)。下面是我的经验教训,你可别犯这个错.假设你想要改变URL的格式,你在你的应用程序中跟踪了很多设置URL的地方,我发现最好有个静态文件处理所有的SWFAddress更新。为SWFAddress设置了监听我用InBox/OutBox。InBox类监听改变,OutBOx做所有的setValue更新。
InBox类有两个静态的方法一个是设置监听,另一个当然是处理监听。在我的creationComplete应用程序中我称为InBox.init()方法。
  1. package model {
  2.         import com.asual.swfaddress.SWFAddressEvent;
  3.         import com.asual.swfaddress.SWFAddress;
  4.         public class InBox {
  5.   
  6.           public static function init():void {
  7.                    SWFAddress.addEventListener( SWFAddressEvent.CHANGE, onSWFAddressChange );
  8.            }
  9.   
  10.           private static function onSWFAddressChange( e:SWFAddressEvent ):void {
  11.                    if( SWFAddress.getPath() == "/" ) {
  12.                             // set view to homepage
  13.                     } else if( SWFAddress.getPath().indexOf( 'something_' ) != -1 ) {
  14.                             // set view to something
  15.                     }
  16.            }
  17. }
复制代码
SWFAddress不仅局限在改变URL中,你也可以改变页面标题,这对于想要收藏这个页面的人来说是非常有用的。
当使用SWFAddress最基本的是你要确保你的应用程序只依靠SWFAddress.CHANGE事件做出改变页面的反映。你不必在将ButtonBar和 ViewStack绑定在一起,可使用OutBox.buttonBarChanged( s:String )方法与 ButtonBar交互的,例如,当通过SWFAddress.setValue( s )改变链接时OutBox.buttonBarChanged( s:String )将被更新。SWFAddress.CHANGE也在这个时候同时工作,然后ViewStack被更新
如下图:

在上面的InBox的例子中不能直接传达给ViewStack,实际上要传达给ViewStack你要在InBox里派遣一个事件

我们清楚的看到SWFAddress是多么简单,然而他要加到一个当前的应用中还是要费一点功夫的,所以如果你决定在你的应用程序中使用他,那么你要在你应用程序的非常基础的部分就要结合他,这样才能避免后面的麻烦。

没有执行怎么办?
很明显SWFAddress用ExternalInterface调用了JavaScript代码,一个普遍的问题是如果某些原因js没有载入,或ExternalInterface在特殊的浏览其中没有执行怎么办?如果没有执行会不阻碍人们的浏览?幸运的是NO,SWFAddress的change事件不是真正的依赖URL的改变工作的。当你使用setValue( 'something' )它激发change事件试着更新URL,如果某些原因没有工作,他并没有丢失。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值