Hello Analytics Reporting API Version 4; JavaScript-Kurzanleitung für Webanwendungen

In dieser Anleitung werden die Schritte für den Zugriff auf Version 4 der Analytics Reporting API beschrieben.

1. API aktivieren

Wenn Sie die Analytics Reporting API Version 4 verwenden möchten, müssen Sie zuerst das Einrichtungstool verwenden. Es führt Sie durch die Erstellung eines Projekts in der Google API Console sowie durch die Aktivierung der API und die Erstellung von Anmeldedaten.

Hinweis: Um eine Web-Client-ID oder einen Client für installierte Anwendungen zu erstellen, müssen Sie im Zustimmungsbildschirm einen Produktnamen festlegen. Falls Sie dies noch nicht getan haben, werden Sie aufgefordert, den Zustimmungsbildschirm konfigurieren.

Anmeldedaten erstellen

Öffnen Sie die Seite Anmeldedaten.
Klicken Sie auf Anmeldedaten erstellen und wählen Sie OAuth-Client-ID aus.
Wählen Sie als Anwendungstyp die Option Webanwendung aus.
Benennen Sie die Client-ID quickstart und klicken Sie auf quickstart.
Legen Sie für Autorisierte JavaScript-Quellen http://localhost:8080 fest.
Klicken Sie auf Erstellen.

2. Beispiel einrichten

Erstellen Sie den Dateinamen HelloAnalytics.html, der den HTML- und JavaScript-Code für unser Beispiel enthält.

Kopieren oder laden Sie den folgenden Quellcode in HelloAnalytics.html herunter.
Ersetzen Sie <REPLACE_WITH_CLIENT_ID> durch die oben erstellte Client-ID.
Ersetzen Sie <REPLACE_WITH_VIEW_ID> durch eine Datenansichts-ID. Eine Datenansichts-ID kann über den Konto-Explorer abgerufen werden.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Hello Analytics Reporting API V4</title>
  <meta name="google-signin-client_id" content="<REPLACE_WITH_CLIENT_ID>">
  <meta name="google-signin-scope" content="https://www.googleapis.com/auth/analytics.readonly">
</head>
<body>

<h1>Hello Analytics Reporting API V4</h1>

<!-- The Sign-in button. This will run `queryReports()` on success. -->
<p class="g-signin2" data-onsuccess="queryReports"></p>

<!-- The API response will be printed here. -->
<textarea cols="80" rows="20" id="query-output"></textarea>

<script>
  // Replace with your view ID.
  var VIEW_ID = '<REPLACE_WITH_VIEW_ID>';

  // Query the API and print the results to the page.
  function queryReports() {
    gapi.client.request({
      path: '/v4/reports:batchGet',
      root: 'https://analyticsreporting.googleapis.com/',
      method: 'POST',
      body: {
        reportRequests: [
          {
            viewId: VIEW_ID,
            dateRanges: [
              {
                startDate: '7daysAgo',
                endDate: 'today'
              }
            ],
            metrics: [
              {
                expression: 'ga:sessions'
              }
            ]
          }
        ]
      }
    }).then(displayResults, console.error.bind(console));
  }

  function displayResults(response) {
    var formattedJson = JSON.stringify(response.result, null, 2);
    document.getElementById('query-output').value = formattedJson;
  }
</script>

<!-- Load the JavaScript API client and Sign-in library. -->
<script src="https://apis.google.com/js/client:platform.js"></script>

</body>
</html>

3: Beispiel ausführen

Veröffentlichen Sie HelloAnalytics.html auf Ihrem Webserver und laden Sie die Seite in Ihrem Browser.
Klicken Sie auf die Schaltfläche Anmelden und autorisieren Sie den Zugriff auf Google Analytics.

Wenn Sie diese Schritte abgeschlossen haben, gibt das Beispiel die Anzahl der Sitzungen in den letzten sieben Tagen für die jeweilige Ansicht aus.