เอกสารนี้ครอบคลุมทุกอย่างที่จำเป็นต้องทราบในการตั้งค่าการติดตามของ Google Analytics สำหรับ Adobe Flash สำหรับสภาพแวดล้อมในการพัฒนาซอฟต์แวร์ Adobe Flex
ดาวน์โหลดไลบรารีการติดตาม
ดาวน์โหลดรหัส (รูปแบบ ZIP) จาก http://code.google.com/p/gaforflash/downloads/list ทำตามวิธีการในไฟล์ readme.txt
เพื่อติดตั้งคอมโพเนนต์ Flex ในการดาวน์โหลดจะมีไฟล์ไลบรารีเพียงไฟล์เดียว ซึ่งต่างจากคอมโพเนนต์ Flash ของ Analytics: /lib/analytics_flex.swc
เพิ่มโค้ดลงในโปรเจ็กต์ของคุณ
ก่อนที่จะเริ่มใช้โค้ดติดตามในโปรเจ็กต์ คุณจะต้องลิงก์ไฟล์ SWC
ที่ดาวน์โหลดไว้เป็นทรัพยากรของโปรเจ็กต์
- เลือกโปรเจ็กต์ -> พร็อพเพอร์ตี้ กล่องโต้ตอบ "คุณสมบัติ" สำหรับโปรเจ็กต์ของคุณจะปรากฏขึ้น
- คลิกเส้นทางการสร้างแบบยืดหยุ่น แล้วเลือกแท็บเส้นทางไลบรารี
- คลิกเพิ่ม SWC... ภายในแผงเส้นทางไลบรารี กล่องโต้ตอบ Add SWC จะปรากฏขึ้น
- ไปที่ตำแหน่งที่คุณแตกซิปไฟล์ Google Analytics API แล้วเลือกไฟล์
lib/analytics.swc
แล้วคลิกตกลง
หรือวางไฟล์analytics.swc
ลงในไดเรกทอรี/libs
ของโปรเจ็กต์ Flex
ตัวอย่างคอมโพเนนต์ Flex MXML
ตัวอย่างต่อไปนี้แสดงวิธีตั้งค่าการติดตามสำหรับปุ่มภายในไฟล์ MXML หากต้องการเริ่มต้นคอมโพเนนต์ MXML ให้ทำดังนี้
- ตั้งค่าพารามิเตอร์เนมสเปซ XML ตั้งค่าพารามิเตอร์ XML Namespace ของออบเจ็กต์การติดตามดังนี้
xmlns:analytics="com.google.analytics.components.*"
- ตั้งชื่อออบเจ็กต์ ในตัวอย่างด้านล่าง พารามิเตอร์
id
ได้รับการตั้งค่าเป็นtracker
- ใช้พารามิเตอร์
account
สำหรับรหัสเว็บพร็อพเพอร์ตี้ รหัสเว็บพร็อพเพอร์ตี้คือสตริงที่ไม่ซ้ำกันที่ใช้ในการติดตามกิจกรรมในเนื้อหา Flash ของคุณ และส่งไปยังข้อมูลพร็อพเพอร์ตี้ (โปรไฟล์) ที่ถูกต้องในบัญชี Analytics ของคุณ - ตั้งค่าโหมดการติดตามด้วยพารามิเตอร์
mode
ใช้Bridge
สำหรับพารามิเตอร์หากคุณกำลังสร้างไฟล์ MXML และต้องการวิธีง่ายๆ ในการใช้การติดตาม ใช้AS3
หากคุณสะดวกที่จะเขียนโค้ดโดยใช้ ActionScript3 โหมด AS3 ช่วยให้คุณสามารถนำเข้าคลาสการติดตาม GA ทั้งหมด ซึ่งคุณสามารถสร้างและกำหนดค่าออบเจ็กต์การติดตามของคุณเองได้ - ตั้งค่าโหมดแก้ไขข้อบกพร่องด้วยพารามิเตอร์
visualDebug
ใช้true
เพื่อเปิดการแก้ไขข้อบกพร่องและการตรวจสอบความถูกต้องสำหรับโปรแกรมของคุณ หรือตั้งค่านี้เป็นfalse
สำหรับการใช้งานจริง
ในตัวอย่างนี้ มีการเพิ่มปุ่ม mybutton
ลงในพื้นที่งาน ระบบจะสร้างอินสแตนซ์ของคอมโพเนนต์การติดตาม Flex ด้วยชื่อ tracker
และกำหนดค่าด้วยพารามิเตอร์ของคอมโพเนนต์ดังกล่าว ขั้นตอนสุดท้าย มีการเพิ่มเหตุการณ์การคลิก onButtonClick
ลงใน mybutton
เมื่อคลิกปุ่ม ระบบจะเพิ่ม /hello world
การดูหน้าเว็บเสมือนด้วยการนับครั้งเดียว
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="800" height="600" > <mx:Script> public function onButtonClick():void { tracker.trackPageview( "/hello world" ); } </mx:Script> <analytics:FlexTracker xmlns:analytics="com.google.analytics.components.*" id="tracker" account="UA-111-222" mode="AS3" visualDebug="false" /> <mx:Button id="mybutton" label="hello world" click="onButtonClick()" /> </mx:Application>
ตัวอย่าง FlexAction 3
ในสถานการณ์ที่ซับซ้อนมากขึ้น คุณอาจต้องเรียกคลาสการติดตาม Screencast 3 แบบเนทีฟโดยตรงจากไฟล์ทรัพยากร ActionScript แม้ว่าตัวอย่างนี้เป็นไฟล์ MXML ด้วย แต่อินสแตนซ์การติดตามทั้งหมดจะดำเนินการในแท็ก <MX:script>
กระบวนการเดียวกันนี้ใช้เพื่อเพิ่มการติดตามไปยังโปรเจ็กต์ ActionScript 3 อื่นๆ ได้
ในตัวอย่างนี้ มีการเพิ่มปุ่ม mybutton
ลงในพื้นที่งาน ในแท็กสคริปต์ ระบบจะนำเข้าไลบรารี 2 รายการดังนี้
com.google.analytics.GATracker; //this is the actual tracking class com.google.analytics.AnalyticsTracker; //this is an interface that the GATracker class implements
หลังจากนำเข้าไลบรารีแล้ว ระบบจะสร้างตัวแปรการติดตาม tracker
เมื่อเพิ่มแอปพลิเคชันไปยังขั้นตอนแล้ว ระบบจะเรียกใช้ onComplete
ซึ่งจะสร้างอินสแตนซ์การติดตาม พารามิเตอร์ 4 อย่างที่คุณต้องใช้ในการเริ่มต้นออบเจ็กต์ GATracker คือ
- อ้างอิงออบเจ็กต์การแสดงผลปัจจุบัน ในตัวอย่างด้านล่าง
this
จะอ้างอิงออบเจ็กต์การแสดงผล - รหัสเว็บพร็อพเพอร์ตี้ รหัสเว็บพร็อพเพอร์ตี้คือสตริงที่ไม่ซ้ำกันที่ใช้ในการติดตามกิจกรรมในเนื้อหา Flash ของคุณ และส่งไปยังข้อมูลพร็อพเพอร์ตี้ (โปรไฟล์) ที่ถูกต้องในบัญชี Analytics ของคุณ
- โหมดการติดตาม พารามิเตอร์ที่ถูกต้องคือ
Bridge
หรือAS3
- โหมดแก้ไขข้อบกพร่อง ตั้งค่า
debug
เป็นfalse
สำหรับการใช้งานจริงและtrue
สำหรับการตรวจสอบความถูกต้องและการแก้ปัญหา
สุดท้าย ในเมธอดการคลิก myButton
ฟังก์ชัน onButtonClick
จะติดตามการเปิดดูหน้าเว็บเสมือนในออบเจ็กต์การติดตามของเรา
เมื่อแอปพลิเคชันนี้ทำงาน ทุกครั้งที่ผู้ใช้คลิกปุ่ม ระบบจะส่งการดูหน้าเว็บเสมือนของคำว่า "hello world" ไปยังเซิร์ฟเวอร์การติดตามของ Google Analytics
<?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()" > <mx:Script> <![CDATA[ import com.google.analytics.GATracker; import com.google.analytics.AnalyticsTracker; public var tracker:AnalyticsTracker; private function onComplete():void { tracker = new GATracker( this, "UA-111-222", "AS3", false ); } public function onButtonClick():void { tracker.trackPageview( "/hello/world" ); } ]]> </mx:Script> <mx:Button id="mybutton" label="hello world" click="onButtonClick()" /> </mx:Application>