Google Analytics สำหรับเว็บไซต์บนอุปกรณ์เคลื่อนที่

ภาพรวม

ในตอนนี้ ข้อมูลทั้งหมดที่คุณคาดหวังจากรายงาน Google Analytics มีให้บริการสำหรับการกำหนดเป้าหมายโทรศัพท์ที่ใช้ WAP หรืออุปกรณ์เคลื่อนที่ระดับล่างอื่นๆ ที่ไม่สามารถเรียกใช้ JavaScript ได้ เพียงวางข้อมูลโค้ดฝั่งเซิร์ฟเวอร์ของเรา (มีสำหรับ PHP, JSP, ASP.NET และ Perl) ลงในแต่ละหน้าที่คุณต้องการติดตาม เมื่อติดตั้งใช้งานแล้ว Google Analytics จะสร้างข้อมูลประเภทเดียวกันในรายงาน Analytics มาตรฐาน ซึ่งรวมถึงข้อมูลเซสชันและแหล่งที่มาของการเข้าชม

เมื่อติดตั้งข้อมูลโค้ดฝั่งเซิร์ฟเวอร์แล้ว โค้ดเฉพาะภาษาจะสร้าง URL สำหรับแท็กรูปภาพที่ต้องวางไว้ในหน้าเว็บที่ติดตามแต่ละหน้า URL ของรูปภาพจะเป็น URL เดียวกับที่โฮสต์ข้อมูลโค้ดฝั่งเซิร์ฟเวอร์ เมื่อผู้ใช้ไปยังหน้าที่ติดตามจากอุปกรณ์เคลื่อนที่ เบราว์เซอร์ในอุปกรณ์เคลื่อนที่จะโหลดหน้าเว็บ ซึ่งจะส่งคำขอรูปภาพที่สร้างโดยตัวอย่างข้างต้น เมื่อข้อมูลโค้ดฝั่งเซิร์ฟเวอร์ได้รับคำขอ ข้อมูลโค้ดจะเริ่มการทำงานของคำขอใหม่เพื่อส่งข้อมูลไปยัง Google Analytics

เริ่มกระบวนการ

ในการเริ่มใช้ข้อมูลโค้ดฝั่งเซิร์ฟเวอร์ของ Google Analytics คุณต้องทำดังนี้

  1. ดาวน์โหลดข้อมูลโค้ดของเซิร์ฟเวอร์สำหรับสภาพแวดล้อมของเซิร์ฟเวอร์
  2. อัปโหลดข้อมูลโค้ดไปยังเซิร์ฟเวอร์
  3. อัปเดตหน้าเว็บบนเซิร์ฟเวอร์ที่คุณต้องการติดตามด้วยรหัสเฉพาะภาษา

ดาวน์โหลดไลบรารี

แพ็กเกจต่อไปนี้มีข้อมูลโค้ดฝั่งเซิร์ฟเวอร์และตัวอย่างสำหรับภาษาที่รองรับทั้งหมด

Package ขนาด ผลรวมตรวจสอบ SHA1
googleanalyticsformobile.zip 35.7 กิโลไบต์ 9102c9d8f9ddd3f53f7330d41b3b14b73a662646

เมื่อดาวน์โหลดแล้ว คุณต้องอัปโหลดข้อมูลโค้ดในภาษาที่เลือกไปยังเว็บเซิร์ฟเวอร์

อัปเดตหน้าเว็บของคุณ

เมื่ออัปโหลดข้อมูลโค้ดฝั่งเซิร์ฟเวอร์ไปยังเว็บเซิร์ฟเวอร์แล้ว คุณก็พร้อมที่จะเพิ่มโค้ดติดตามลงในหน้าเว็บแต่ละหน้าของคุณ คลิกแท็บสำหรับคำแนะนำเฉพาะภาษาโปรแกรม

หมายเหตุ: คุณต้องเปลี่ยนคำนำหน้าในรหัสเว็บพร็อพเพอร์ตี้ Analytics จาก UA- เป็น MO- ในข้อมูลโค้ดฝั่งเซิร์ฟเวอร์ที่ระบุไว้ด้านล่าง ตัวอย่างเช่น หากรหัสเว็บพร็อพเพอร์ตี้คือ UA-12345-67 คุณจะใช้ MO-12345-67 ในข้อมูลโค้ดฝั่งเซิร์ฟเวอร์


PHP

ข้อมูลโค้ดฝั่งเซิร์ฟเวอร์สำหรับ PHP ต้องใช้ PHP 5

แพ็กเกจ Google Analytics สำหรับอุปกรณ์เคลื่อนที่ PHP ประกอบด้วยไฟล์ชื่อ ga.php ซึ่งเมื่อโหลดแล้ว จะเขียนรูปภาพขนาดเล็กลงในการตอบกลับ หากต้องการใช้งาน คุณต้องคัดลอก ga.php ไปยังโปรเจ็กต์เพื่อให้สคริปต์ PHP อื่นๆ ของคุณเข้าถึงได้ ผู้ใช้ของคุณจะไม่เข้าถึงสคริปต์นี้โดยตรง แต่สคริปต์ PHP ของคุณจะมีแท็ก HTML <img> ซึ่งอ้างอิงถึง ga.php ส่วนโค้ด ga.php จะส่งคำขอไปยังบริการ Analytics และส่งข้อมูลรูปภาพที่แสดงผลผ่าน HTML

มีเมธอดตัวอย่าง googleAnalyticsGetImageUrl รวมอยู่ในแพ็กเกจเพื่อช่วยคุณสร้าง URL แบบเต็มของรูปภาพ ตัวอย่างสคริปต์มีดังนี้

<?php
  // Copyright 2009 Google Inc. All Rights Reserved.
  $GA_ACCOUNT = "ACCOUNT ID GOES HERE";
  $GA_PIXEL = "/ga.php";

  function googleAnalyticsGetImageUrl() {
    global $GA_ACCOUNT, $GA_PIXEL;
    $url = "";
    $url .= $GA_PIXEL . "?";
    $url .= "utmac=" . $GA_ACCOUNT;
    $url .= "&utmn=" . rand(0, 0x7fffffff);

    $referer = $_SERVER["HTTP_REFERER"];
    $query = $_SERVER["QUERY_STRING"];
    $path = $_SERVER["REQUEST_URI"];

    if (empty($referer)) {
      $referer = "-";
    }
    $url .= "&utmr=" . urlencode($referer);

    if (!empty($path)) {
      $url .= "&utmp=" . urlencode($path);
    }

    $url .= "&guid=ON";

    return str_replace("&", "&amp;", $url);
  }
?>

เรียกวิธีนี้และใช้ URL ที่ได้เป็นแอตทริบิวต์ src ของแท็ก HTML <img> ได้ง่ายๆ เมธอดจะส่งคำขอไปยัง ga.php พร้อมพารามิเตอร์การติดตามที่เกี่ยวข้อง ga.php จะส่งพารามิเตอร์เหล่านี้ไปยังบริการ Analytics และแสดงรูปภาพเพื่อแสดงผล

<?php
  $googleAnalyticsImageUrl = googleAnalyticsGetImageUrl();
  echo '<img src="' . $googleAnalyticsImageUrl . '" />';
?>

JSP

ข้อมูลโค้ดฝั่งเซิร์ฟเวอร์สำหรับ JSP ได้รับการทดสอบบน Jetty 6

แพ็กเกจ Google Analytics สำหรับอุปกรณ์เคลื่อนที่ JSP มีไฟล์ชื่อ ga.jsp ซึ่งเมื่อโหลดแล้วจะเขียนรูปภาพขนาดเล็กลงในการตอบกลับ หากต้องการใช้งาน คุณต้องคัดลอก ga.jsp ไปยังโปรเจ็กต์ และตรวจสอบว่าได้ใส่การแมปใน web.xml มิเช่นนั้นแล้ว ผู้ใช้ของคุณจะไม่เข้าถึง JSP โดยตรง แต่ JSP ของคุณเองจะมีแท็ก HTML <img> ซึ่งอ้างอิง JSP นี้ ส่วนโค้ด ga.jsp จะส่งคำขอไปยังบริการ Analytics และส่งข้อมูลรูปภาพที่แสดงผลผ่าน HTML

เมธอดตัวอย่าง googleAnalyticsGetImageUrl จะรวมอยู่ในแพ็กเกจการดาวน์โหลดเพื่อช่วยสร้าง URL ของรูปภาพแบบเต็ม ต่อไปนี้คือตัวอย่าง JSP

<%@ page import="java.io.UnsupportedEncodingException,
                    java.net.URLEncoder" %>
<%!
  // Copyright 2009 Google Inc. All Rights Reserved.
  private static final String GA_ACCOUNT = "ACCOUNT ID GOES HERE";
  private static final String GA_PIXEL = "/ga.jsp";

  private String googleAnalyticsGetImageUrl(
      HttpServletRequest request) throws UnsupportedEncodingException {
    StringBuilder url = new StringBuilder();
    url.append(GA_PIXEL + "?");
    url.append("utmac=").append(GA_ACCOUNT);
    url.append("&utmn=").append(Integer.toString((int) (Math.random() * 0x7fffffff)));

    String referer = request.getHeader("referer");
    String query = request.getQueryString();
    String path = request.getRequestURI();

    if (referer == null || "".equals(referer)) {
      referer = "-";
    }
    url.append("&utmr=").append(URLEncoder.encode(referer, "UTF-8"));

    if (path != null) {
      if (query != null) {
        path += "?" + query;
      }
      url.append("&utmp=").append(URLEncoder.encode(path, "UTF-8"));
    }

    url.append("&guid=ON");

    return url.toString().replace("&", "&amp;");
  }
%>

เรียกวิธีนี้และใช้ URL ที่ได้เป็นแอตทริบิวต์ src ของแท็ก HTML <img> ได้ง่ายๆ เมธอดจะส่งคำขอไปยัง ga.jsp พร้อมพารามิเตอร์การติดตามที่เกี่ยวข้อง ga.jsp จะส่งพารามิเตอร์เหล่านี้ไปยังบริการ Analytics และแสดงรูปภาพเพื่อแสดงผล

<% String googleAnalyticsImageUrl = googleAnalyticsGetImageUrl(request); %>
<img src="<%= googleAnalyticsImageUrl %>" />

ASP.net

ข้อมูลโค้ดฝั่งเซิร์ฟเวอร์สำหรับ ASP.NET ได้รับการทดสอบบน IIS 6.0 แล้ว

แพ็กเกจ Google Analytics สำหรับอุปกรณ์เคลื่อนที่ ASP.NET มีไฟล์ชื่อ ga.aspx ซึ่งเมื่อโหลดแล้วจะเขียนรูปภาพขนาดเล็กไปยังการตอบกลับ หากต้องการใช้งาน คุณต้องคัดลอก ga.aspx ไปยังโปรเจ็กต์เพื่อให้ ASP อื่นๆ ของคุณเข้าถึงได้ ผู้ใช้ของคุณจะไม่เข้าถึง ASP โดยตรง แต่ ASP ของคุณจะมีแท็ก HTML <img> ซึ่งอ้างอิง ga.aspx ส่วนโค้ด ga.aspx จะส่งคำขอไปยังบริการ Analytics และส่งข้อมูลรูปภาพที่แสดงผลผ่าน HTML

เมธอดตัวอย่าง GoogleAnalyticsGetImageUrl จะรวมอยู่ในแพ็กเกจการดาวน์โหลดเพื่อช่วยสร้าง URL รูปภาพแบบเต็ม ต่อไปนี้คือตัวอย่าง ASP

<%@ Page Language="C#" %>
<script language="C#" runat="server">
  // Copyright 2009 Google Inc. All Rights Reserved.
  private const string GaAccount = "ACCOUNT ID GOES HERE";
  private const string GaPixel = "/ga.aspx";

  private string GoogleAnalyticsGetImageUrl() {
    System.Text.StringBuilder url = new System.Text.StringBuilder();
    url.Append(GaPixel + "?");
    url.Append("utmac=").Append(GaAccount);

    Random RandomClass = new Random();
    url.Append("&utmn=").Append(RandomClass.Next(0x7fffffff));

    string referer = "-";
    if (Request.UrlReferrer != null
        && "" != Request.UrlReferrer.ToString()) {
      referer = Request.UrlReferrer.ToString();
    }
    url.Append("&utmr=").Append(HttpUtility.UrlEncode(referer));

    if (HttpContext.Current.Request.Url != null) {
      url.Append("&utmp=").Append(HttpUtility.UrlEncode(Request.Url.PathAndQuery));
    }

    url.Append("&guid=ON");

    return url.ToString().Replace("&", "&amp;");
  }
</script>

เรียกวิธีนี้และใช้ URL ที่ได้เป็นแอตทริบิวต์ src ของแท็ก HTML <img> ได้ง่ายๆ เมธอดจะส่งคำขอไปยัง ga.aspx พร้อมพารามิเตอร์การติดตามที่เกี่ยวข้อง ga.aspx จะส่งพารามิเตอร์เหล่านี้ไปยังบริการ Analytics และแสดงรูปภาพเพื่อแสดงผล

<% string googleAnalyticsImageUrl = GoogleAnalyticsGetImageUrl(); %>
<img src="<%= googleAnalyticsImageUrl %>" />

Perl

ข้อมูลโค้ดฝั่งเซิร์ฟเวอร์สำหรับ Perl ต้องใช้ Perl 5.10

แพ็กเกจ Google Analytics สำหรับอุปกรณ์เคลื่อนที่ Perl มีไฟล์ชื่อ ga.pl ซึ่งเมื่อโหลดแล้ว ระบบจะเขียนรูปภาพขนาดเล็กลงในการตอบกลับ หากต้องการใช้งาน คุณต้องคัดลอก ga.pl ไปยังโปรเจ็กต์เพื่อให้สคริปต์ Perl อื่นๆ เข้าถึงได้ ผู้ใช้ของคุณจะไม่เข้าถึงแท็กดังกล่าวโดยตรง แต่สคริปต์ Perl ของคุณเองจะมีแท็ก HTML <img> ซึ่งอ้างอิงถึง ga.pl ส่วนโค้ด ga.pl จะส่งคำขอไปยังบริการ Analytics และส่งข้อมูลรูปภาพที่แสดงผลผ่าน HTML

ตัวอย่างกิจวัตรย่อย google_analytics_get_image_url จะรวมอยู่ในแพ็กเกจการดาวน์โหลดเพื่อช่วยสร้าง URL ของรูปภาพแบบเต็ม ตัวอย่างสคริปต์มีดังนี้

# Copyright 2009 Google Inc. All Rights Reserved.
use URI::Escape;

use constant GA_ACCOUNT => 'ACCOUNT ID GOES HERE';
use constant GA_PIXEL => '/ga.pl';

sub google_analytics_get_image_url {
  my $url = '';
  $url .= GA_PIXEL . '?';
  $url .= 'utmac=' . GA_ACCOUNT;
  $url .= '&utmn=' . int(rand(0x7fffffff));

  my $referer = $ENV{'HTTP_REFERER'};
  my $query = $ENV{'QUERY_STRING'};
  my $path = $ENV{'REQUEST_URI'};

  if ($referer eq "") {
    $referer = '-';
  }

  $url .= '&utmr=' . uri_escape($referer);
  $url .= '&utmp=' . uri_escape($path);
  $url .= '&guid=ON';

  $url =~ s/&/&amp\;/g;
  $url;
}

คราวนี้ขอเรียกสั้นๆ ว่าเรียกใช้รูทีนย่อยนี้และใช้ URL ที่ได้เป็นแอตทริบิวต์ src ของแท็ก HTML <img> รูทีนย่อยจะส่งคำขอไปยัง ga.pl พร้อมพารามิเตอร์การติดตามที่เกี่ยวข้อง ga.pl จะส่งพารามิเตอร์เหล่านี้ไปยังบริการ Analytics และแสดงรูปภาพเพื่อแสดงผล

print '<img src="' . google_analytics_get_image_url() . '" />';