Posts Tagged Google Analytics Data Api

Why I have been talking so much about Google Analytics lately

If you take a look at my 4-5 last post you’ll notice that they are all about Google Analytics, be it Google Analytics for Flash or Google Analytics Data API. There are a couple of good reasons for that.

A new presentation

First, I’m really proud (and scared) to say that I am going to give a presentation at the InsideRIA conference in August in San Jose. The topic will be Google Analytics For Flash so I’m mostly going to reuse my presentation I did for the Montreal Flash User Group but I will adapt it for RIAs and I will add a big part on how to retrieve the data you send to Google back in your RIA using Google Analytics Data API. So I need to shape up on those topics and learn every thing there is to learn so that I can give a presentation with great content.

A new application

Secondly, I have this great idea. I wasn’t going to blog about it at first until it was done but my motivation kinda withered so I hope that by exposing it here and getting feedback I will start working on it again. What I want to do is build a rich internet application that displays Google Analytics Data in a way that makes more sense for Flash website. Flash website differs from HTML website in a lot of ways but web analytics don’t display their data while taking these differences into consideration. If we only take preloading and videos, we could have insightful data visualization that would show how many people saw which section of your video (that could be a heat map representing the timeline of the video) or how many people started the preloading process but didn’t end it. Another area that I would like to tackle is to set a standard on how to use events.

Right now there is no clear guideline on how to use events. It’s really free for all and no one is doing the same thing, so when you go in someone else reports it takes a while to understand what is going on. So I would basically be creating a set of guidelines for Events and then my application would be interpreting them differently than Google Analytics. While I’m there I could also associate events with pageviews. What is disturbing right now is that with events you can know how many people clicked on your button but it is pretty hard to see how many people actually saw the button so it’s hard to tell if your interface is performing well.

Well that my plan, the first step was to be able to connect to Google Analytics Data API using Flash on a webserver which I found out how. Now what I have left to do is create the guidelines for events and the interpret the data from Google Analytics. If you got any feedback on my idea please put it in the comments; it would really motivate me to start working on it.

, , , ,

1 Comment


How to connect to Google Analytics Data API in Flash

In one of my previous post, I explained how to connect to Google Analytics Data API in AIR. The problem with that way of connecting was that it only worked in AIR. In Flash it works locally, but as soon as you put in on your web server it stops working. Not it is cool to build an AIR (desktop) application that pulls data from Google Analytics, but it would also be cool to build a web application that does the same thing. Well I found out how to do just that. It is a bit more complicated because it involves a bit of server side coding, in this case PHP.

How the process works is that first you login to Google Analytics, Google will then send you a token that you must use when asking for data. So we will have two simple PHP files; one to login in and one to ask for data.

The first one looks like this:

<?php
//this file is called get_token.php
$user = $_REQUEST[user];
$pass = $_REQUEST[pass]
 
require_once 'curl.php';
$curl = new Curl;
$response = $curl-&gt;post('https://www.google.com/accounts/ClientLogin', array(accountType => "GOOGLE",  Email =>$user, Passwd => $pass, service => "analytics", source => "zedia-GAStats-0" ));
$tempArray = explode("Auth=", $response);
?>
<root>
	<token><?php echo ($tempArray[1] ); ?></token>
</root>

The second one looks like this:

<?php
//this file is called call_ga.php
require_once 'curl.php';
$url = $_REQUEST["url"];
$token = $_REQUEST["token"];
 
$curl2 = curl_init();
curl_setopt($curl2, CURLOPT_SSL_VERIFYPEER, FALSE);
curl_setopt($curl2, CURLOPT_HEADER, "0");
curl_setopt($curl2, CURLOPT_RETURNTRANSFER, TRUE);
curl_setopt($curl2, CURLOPT_URL, $url);
 
curl_setopt($curl2, CURLOPT_HTTPHEADER, array('Authorization: GoogleLogin auth=' . $token));
$response2 = curl_exec($curl2);
echo ($response2);
?>

As you can see to make my calls to Google I am using the cURL library that is usually already installed on your server if you have PHP. Also for the get_token.php I am also using the Curl class, made by Sean Huber, that just makes it easier to work with cURL.  Upload these files to your server. Now that we have the server side figured out, we can move on to the Flash part;  here it is:

package
{
import flash.display.Sprite;
import flash.events.Event;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.net.URLVariables;
import flash.text.TextField;
 
public class Main extends Sprite
{
  private var loader:URLLoader;
  private var _loader2:URLLoader;
  private var _textField:TextField;
  private var _token:String;
  private var _buffer:String = "";
  public function Main():void
  {
    loader = new URLLoader();
    loader.addEventListener(Event.COMPLETE, _onTokenLoaded, false, 0, true);
   //this call will load the token
 
    loader.load(new URLRequest("http://www.YOUR_URL_WHERE_THE_PHP_RESIDE.net/get_token.php?user=YOUR_USERNAME&pass=YOUR_PASSWORD"));
 
    _textField = new TextField();
    _textField.height = 300;
    _textField.width = 300;
    _textField.multiline = true;
    _textField.wordWrap = true;
 
    addChild(_textField);
  }
 
  private function _onTokenLoaded(event:Event):void {
    var tempString:String = String(loader.data);
    tempString = tempString.substring(1, tempString.length);
    var tempXML:XML = XML(tempString);
    _token = tempXML.token;
 
    _textField.text = _token;
 
    _loader2 = new URLLoader();
    _loader2.addEventListener(Event.COMPLETE, _onFeedLoaded, false, 0, true);
 
    var request:URLRequest = new URLRequest("http://www.YOUR_URL_WHERE_THE_PHP_RESIDE.net/call_ga.php");
    var urlVar:URLVariables = new URLVariables();
    urlVar.token = _token;
    urlVar.url = "https://www.google.com/analytics/feeds/accounts/default";
    request.data = urlVar;
 
    _loader2.load(request);
  }
 
  private function _onFeedLoaded(event:Event):void {
    _textField.text = String (_loader2.data);
  }
 }
}

What you basically do is that you use your server to do all the communication between the Flash and Google. Everytime you will want a different feed to get different data you will call the call_ga.php file. It is that simple. If you have any question on this feel free to ask them in the comments.

, , , , , ,

12 Comments


How to connect to Google Analytics Data API in AIR

I had a bit of trouble doing just this a while ago, ended up trying many different ways and finally a reader of this blog, Nakamachi, gave me the solution. Because I think many of you are trying to connect to Google Analytics Data API ( or any Google APIs for that matters) I will give you here my solution. My solution only works in AIR; I don’t know why, but as soon as I put it on the web, it stops working. I have found a solution for that problem too but I will keep it for another post.
Here is how you can connect to GData:

import org.httpclient.HttpClient;
import com.adobe.net.URI;
import org.httpclient.events.HttpResponseEvent;
import org.httpclient.events.HttpRequestEvent;
import org.httpclient.HttpRequest;
import org.httpclient.http.Get;
import org.httpclient.events.HttpDataEvent;
 
var _firstBuffer:String = "";
var _secondBuffer:String = "";
 
//this first connection will get the authorization token by sending the user name and password for Google Analytics
function submitForm(email:String, password:String):void {
  var client:HttpClient = new HttpClient();
  var uri:URI = new URI("https://www.google.com/accounts/ClientLogin");
  var variables:Array = [{name:"accountType", value:"GOOGLE"}, {name:"Email", value: email}, {name:"Passwd", value: password}, {name:"service", value: "analytics"}, {name:"source", value: "your-application-identifier"}];
  client.listener.onData = _onFirstData;
  client.listener.onComplete = _onLoaderComplete;
  client.postFormData(uri, variables);
}
 
function _onFirstData(event:HttpDataEvent):void {
  _firstBuffer += event.readUTFBytes();
}
 
//this second connection will request information to GData
//in this case account info for Google Analytics by
//putting the auth token in the header of the request
function _onLoaderComplete(event:HttpResponseEvent):void {
  var tempArray:Array = _firstBuffer.split("Auth=");
 var  _authToken:String = String(tempArray[1]);
 
  var client:HttpClient = new HttpClient();
  var uri:URI = new URI("https://www.google.com/analytics/feeds/accounts/default");
  var request:HttpRequest = new Get();
  request.addHeader("Authorization", "GoogleLogin auth=" + _authToken);
 
  client.listener.onData = function(event:HttpDataEvent):void {
    _secondBuffer += event.readUTFBytes();
  }
  client.listener.onComplete = _onSecondLoaderComplete;
  client.request(uri, request);
}
 
function _onSecondLoaderComplete(event:HttpResponseEvent):void {
  trace (_secondBuffer);
}

As you can see in order to circumvent the Authorization header restriction I am using the as3httpclientlib library which requires the as3corelib and as3crypto libraries to compile. Using the same principle you should be able to connect to Google APIs from your AIR application.

, , , , , , , ,

14 Comments


Connecting to Google Analytics Data Api using AS3; my failures

EDIT:
Finally I turned my failures into success you can read it here:
How to connect to Google Analytics Data API in AIR
How to connect to Google Analytics Data API in Flash

These past three days I have spent my time trying to connect from an AIR application to Google Analytics Data Api and I have failed. Sometimes you just admit to yourself thatwhat you want to do is just impossible. The problem is that I know it is feasible, Desktop Reporting is doing it with their AIR application called Polaris. Now all I think about is how I can solve this problem. In this post I’m going to show what I tried in order to accomplish this so that it might help others or that others can help me.

The big obstacle at the root of my problem is the fact that you can’t set the Authorization header in ActionScript which is required to make request to the Google server to get data. Here is how I found out about this:

var request:URLRequest = new URLRequest("https://www.google.com/analytics/feeds/accounts/default");
 
request.method = URLRequestMethod.GET;
var tempHeader:URLRequestHeader = new URLRequestHeader("Authorization", "GoogleLogin auth=" + _authToken);
request.requestHeaders = [tempHeader];
var  _secondLoader:URLLoader = new URLLoader();
_secondLoader.addEventListener(Event.COMPLETE, _onSecondLoaderComplete, false, 0, true);
_secondLoader.dataFormat = URLLoaderDataFormat.TEXT;
_secondLoader.load(request);

This resulted in the following runtime error:

ArgumentError: Error #2096: The HTTP request header GoogleLogin auth=DQA … -lQ
cannot be set via ActionScript

From that point on I was aware that you couldn’t set the Authorization request header even thought you see misleading information around the web that doesn’t help. My next try was using HTTPService from the Flex library here is what I tried:

gService.url = "https://www.google.com/analytics/feeds/accounts/default";
 
gService.headers["Authorization"] = "GoogleLogin auth=" + _authToken;
var token:AsyncToken = gService.send();
token.addResponder(new Responder(onResponse, onFault));

This ended up with the same result (obviously).

My next try was using the as3httpclient library which I did in this way:

var client:HttpClient = new HttpClient();
var uri:URI = new URI("https://www.google.com/analytics/feeds/accounts/default");
var request:HttpRequest = new Get();
request.addHeader("Authorization", "GoogleLogin auth=" + _authToken);
 
client.listener.onData = function(event:HttpDataEvent):void {
trace (event.readUTFBytes)
};
client.request(uri, request);

This seemed to work a bit better but it always traced “200″ and not the xml feed it was supposed to return.

So I am at this point very frustrated because I am not able to do something I know is feasible. I have other step I can take in my project and I have some not very optimal way of getting the data, but I have a very bitter taste left in my mouth.  If anyone can help me with this, it would be really appreciated.

, , , , , , , , ,

12 Comments