Google Analytics Realtime API – Live Dashboard in Google Spreadsheets

Real Time Dashboard Google Analytics

Google APIs machen Spaß, denn sie sind einfach anzusprechen und relativ gut dokumentiert. Heute wollen wir uns ein Realtime-Dashboard mit der Google Analytics Realtime-API bauen. In diesem Dashboard sehen wir dann Realtime-KPIs verschiedener Projekte/Mandanten auf einen Blick. In wenigen Schritten – ganz ohne Programmierkenntnisse.

Unser Ziel in diesem Posting ist es ein Dashboard in Google Spreadsheets zu bauen, das automatisiert jede Minute neue Daten aus der API zieht und in einem Dashboard darstellt. Bevor wir uns an die Arbeit machen müssen ein paar Grundlagen erwähnt werden. Wer direkt loslegen will springt zum nächsten Abschnitt.

Google hat bereits Ende 2013 die ersten Beta-Zugänge zur Realtime API verteilt. Mittlerweile ist der Zugang noch immer als Beta gekennzeichnet, eine Anfrage zur API wird in der Regel jedoch sehr schnell beantwortet. Einen entsprechenden Link zur Freigabe findet ihr in der Doku zur Realtime API.

Im Folgenden basiert diese Anleitung vor allem auf der Vorarbeit von Nick Mihailovski. Er hat vor vielen Jahren das „Magic Script“ für Google Spreadsheets geschrieben, auf diesem Code setzen wir auf. Deshalb gehen hier die meisten Credits an Nick, der auch heute noch sehr erfolgreich bei Google an Analytics Projekten arbeitet.

Schritt für Schritt zum Dashboard

Um an das Dashboard zu kommen müssen wir grundsätzlich vier Schritte ausführen. Zuerst wird unsere Vorlage für das Dashboard als eigene Spreadsheet Datei in Google Drive kopiert. Danach wird die API und das Skript konfiguriert. Zum Schluss geben wir die Informationen zu Google Analytics an und können dann die Daten automatisiert abrufen (z. B. jede Minute).

Hier die Schritte im Detail.

1. Spreadsheet Vorlage kopieren
Öffnet unsere fertige Vorlage wngmn.de Realtime Dashboard Google Analytics. Bitte kopiert die Vorlage als eigene Spreadsheet Datei in euer Google Drive Konto. Dazu müsst ihr einfach im Kontextmenü des Spreadsheets auf „Datei“ klicken und danach „Kopie erstellen…“. Jetzt habt ihr euer eigenes Dashboard, das nur noch konfiguriert werden muss.

Dabei wird automatisch auch der angepasste Code mitkopiert. Ihr könnt unter „Tools“ den „Skripteditor…“ aufrufen. Hier seht ihr den von uns angepassten Code. Erweitert haben wir vor allem folgende zwei Funktionen um Realtime Daten abrufen zu können.
Bitte beachtet, dass es sich hier um einen „Hack“ handelt, der nicht zu 100% dokumentiert ist. Es ist keine saubere Erweiterung des bestehenden Codes, sondern eine schnelle und pragmatische Lösung. Zum Beispiel wird als Report Type weiterhin „Core“ definiert, obwohl es sich hier nicht um die Core API handelt. Das ist jedoch für den Ablauf und Funktionalität nicht ausschlaggebend.

Für alle die sich das gerne mal im Detail ansehen möchten hier die angepassten Passagen.

function getRealtimeData(e) {
  setupLog_();
  var now = new Date();
  log_('Running on: ' + now);
  var sheet = getOrCreateGaSheet_();
  var configs = getConfigs_(sheet);
  if (!configs.length) {
   log_('No report configurations found');
  } else {
     log_('Found ' + configs.length + ' report configurations.');
     for (var i = 0, config; config = configs[i]; ++i) {
       var configName = config[NAME];
       try {
         log_('Executing query: ' + configName);
         var results = getRealtimeResults_(config);
         log_('Success. Writing results.');
         displayResults_(results, config);
       } catch (error) {
         log_('Error executing ' + configName + ': ' + error.message);
       }
     }
  }

  log_('Script done');

  // Update the user about the status of the queries.
  if( e === undefined ) {
   displayLog_();
  }
}

Außerdem wurde auch folgende Passage angepasst.

function getRealtimeResults_(config) {
    // Translate last n days into the actual start and end dates.
    // This value overrides any existing start or end dates.

    if (config['last-n-days']) {
        var lastNdays = parseInt(config['last-n-days'], 10);
        config['start-date'] = getLastNdays_(lastNdays);
        config['end-date'] = getLastNdays_(0);
    }

    //Analytics.Data.Realtime.get(ids, metrics, optionalArgs)
    var type = config[TYPE] || CORE_TYPE; // If no type, default to core type.
    if (type == CORE_TYPE) {
        var optParameters = getOptParamObject_(CORE_OPT_PARAM_NAMES, config);
        //var apiFunction = Analytics.Data.Ga.get;
        var apiFunction = Analytics.Data.Realtime.get;

    } else if (type == MCF_TYPE) {
        var optParameters = getOptParamObject_(MCF_OPT_PARAM_NAMES, config);
        var apiFunction = Analytics.Data.Mcf.get;
    }

    // Execute query and return the results.
    // If any errors occur, they will be thrown and caught in a higher
    // level of code.

    var results = apiFunction(
        config['ids'],
        config['metrics'],
        optParameters);

    return results;
}

 

2. API konfigurieren

Jedes neue Spreadsheet das eine Verbindung zu einer Google API aufbaut ist ein neues Projekt in der Google Developer Console. Jedes solche Projekt bei Google bekommt eine Projekt-ID. Zu jedem Projekt können APIs ganz einfach an und abgewählt werden.

Um für euer Dashboard die entsprechende API zu aktivieren müsst ihr im Spreadsheet folgende Menüpunkte anklicken (das Menü ist in dem Fenster sichtbar, in dem ihr den Code für das Skript seht).

google spreadsheet menu

Nun aktiviert ihr unter „Erweiterte Google-Dienste…“ die Google Analytics Library. Hier findet ihr auch den Link „Google Developers Console“ zu eurem Projekt. Klickt darauf um die API Liste zum Projekt bei Google abzurufen. Hier könnt ihr per Klick die Google Analytics API aktivieren.

google api

Vergesst nicht auch den Link „Google Developers Console“ anzuklicken. Auch hier müsst ihr den Zugriff noch freigeben. Der Button zum Aktivieren sieht so aus:

google analytics api

3. Ein erster Test

Nun können wir zurück zum Spreadsheet. In diesem sehen wir die Reiter „Dashboard“, „config“ und mehrere „Data“ Einträge. Wir klicken auf „config“ um hier unsere Werte zu hinterlegen. Notwendig ist die Google Analytics View ID (ga:12345678).

Die ID eures GA Kontos findet ihr mit der Funktion „Find Profile / IDs“ im Kontextmenü „Google Analytics“.

Diesen Wert müssen wir im Reiter „config“ nun in die Zelle B4 eintragen. Weitere IDs aus anderen Projekten könnt ihr einfach in die Zellen daneben eintragen (D4, F4, usw.). Es sind drei Konfigurationen eingegeben (in den Spalten A:B, C:D, E:F). Ihr könnt gerne weitere Konfigurationen eintragen (einfach Spalte A:B kopieren und rechts anfügen) oder eine Konfiguration löschen. Achtet bitte immer auch auf die letzte Zeile einer Konfiguration, hier muss ein Name für den Reiter vergeben werden (am besten den fortlaufend zählenden Namen weiterführen, „Data1“, „Data2“, usw.).

Jetzt klicken wir im Kontextmenü „Google Analytics“ auf „Get Real Time Data“. Damit aktualisieren sich die Daten im „Dashboard“ Reiter.

Zur Konfiguration der Realtime-Daten könnt ihr folgende Parameter nutzen, die Google hier unter Realtime API metrics and dimensions dokumentiert hat. Weitere Details zum konfigurieren findet ihr hier.

4. Automatisierung

Damit wir nicht jede Minute auf den Knopf drücken müssen gibt es eine chronologische Funktion in Spreadsheets. Ruft einfach wieder im Menü „Tools“ den „Scripteditor“ auf um den Code zu sehen. Klickt hier auf das Symbol zur zeitgesteuerten Ausführung.

google spreadsheet time scheduling

Hier müssen wir die Konfiguration wie folgt definieren.

google spreadsheet scheduling configuration

Nun aktualisiert sich das Dashboard jede Minute neue und enthält die Realtime Werte aus Google Analytics. Das ging doch vergleichsweise einfach, oder?

Was jetzt?

  • Schreibt mir einen Kommentar, wie ihr Spreadsheets als Dashboard verwendet
  • Entwickelt das Skript weiter, zum Beispiel um auch Google Webmaster Tools Daten anzuzeigen (entsprechende Google APIs gibt es schon)
  • Teilt diesen Beitrag

 


Kommentare

Andy am 18. Februar 2016 um 18:44:35

Geiles Ding, danke!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.