שלום Analytics Reporting API v4; מדריך למתחילים של JavaScript לאפליקציות אינטרנט

במדריך הזה מפורטים השלבים לגישה אל Analytics Reporting API v4.

‫1. הפעלת ה-API

על מנת להתחיל להשתמש ב-Analytics Reporting API v4, קודם צריך להשתמש בכלי ההגדרה, שמדריך אתכם ביצירת פרויקט במסוף Google API, הפעלת ה-API ויצירת פרטי כניסה.

הערה: כדי ליצור מזהה לקוח באינטרנט או לקוח של אפליקציה מותקנת, עליך להגדיר שם מוצר במסך ההסכמה. אם עדיין לא עשית זאת, תוצג לך בקשה להגדיר את מסך ההסכמה.

יצירת פרטי כניסה

  • פותחים את הדף 'פרטי כניסה'.
  • לוחצים על Create credentials ובוחרים באפשרות OAuth client ID.
  • בשדה Application type, בוחרים באפשרות Web application.
  • נותנים שם לquickstart של מזהה הלקוח ולוחצים על quickstart.
  • הגדרת מקורות ה-JavaScript המורשים ל-http://localhost:8080
  • לוחצים על יצירה.

2. הגדרת הדוגמה

תצטרכו ליצור שם קובץ אחד HelloAnalytics.html, שיכיל את קוד ה-HTML וה-JavaScript לדוגמה שלנו.

  • העתק או הורד את קוד המקור הבא אל HelloAnalytics.html.
  • מחליפים את <REPLACE_WITH_CLIENT_ID> במזהה הלקוח שנוצר למעלה.
  • מחליפים את <REPLACE_WITH_VIEW_ID> במזהה התצוגה המפורטת. ניתן לאחזר מזהה תצוגה מפורטת מסייר החשבונות.
<!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: הרצת הדוגמה

  • מפרסמים את HelloAnalytics.html בשרת האינטרנט וטוענים את הדף בדפדפן.
  • לוחצים על הלחצן כניסה ומאשרים גישה ל-Google Analytics.

כשתסיימו את השלבים האלה, הדגימה תייצר פלט של מספר הסשנים בשבעת הימים האחרונים עבור התצוגה המפורטת הנתונה.