דוגמאות לקוד JavaScript

קטע הקוד שבהמשך משתמש בספריית הלקוחות של Google APIs עבור JavaScript. אתם יכולים להוריד את הדוגמה הזו מהתיקייה javascript במאגר דוגמאות של קודי API של YouTube ב-GitHub.

הקוד מבקש הרשאה מהמשתמש לגשת להיקף https://www.googleapis.com/auth/yt-analytics.readonly.

return gapi.auth2.getAuthInstance()
    .signIn({scope: "https://www.googleapis.com/auth/yt-analytics.readonly"})
    ...

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

אחזור נתונים סטטיסטיים יומיים של הערוץ

הדוגמה הזו קוראת ל-YouTube Analytics API כדי לאחזר צפיות יומיות ומדדים אחרים עבור הערוץ של המשתמש בשנה הקלנדרית 2017. הדוגמה כוללת את ספריית הלקוחות של JavaScript של Google APIs.

הגדרה של פרטי כניסה להרשאה

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

1. יוצרים או בוחרים פרויקט במסוף Google API.
2. מפעילים את YouTube Analytics API בפרויקט שלכם.
3. בחלק העליון של הדף Credentials, בוחרים בכרטיסייה OAuth Consent Screen. בוחרים כתובת אימייל, מזינים את שם המוצר אם הוא עדיין לא הוגדר ולוחצים על הלחצן 'שמירה'.
4. בדף Credentials, לוחצים על הלחצן Create credentials ובוחרים באפשרות OAuth Client ID.
5. בוחרים בסוג האפליקציה 'אפליקציית אינטרנט'.
6. בשדה 'מקורות JavaScript מורשים', מזינים את כתובת ה-URL שממנה תציג את דוגמת הקוד. לדוגמה, אפשר להזין שם כמו http://localhost:8000 או http://yourserver.example.com. ניתן להשאיר את השדה URIs מורשה של הפניה מחדש ריק.
7. לוחצים על הלחצן Create כדי לסיים את יצירת פרטי הכניסה.
8. לפני סגירת תיבת הדו-שיח, מעתיקים את מזהה הלקוח, שאותו צריך להוסיף לדוגמת הקוד.

יצירת עותק מקומי של הדוגמה

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

gapi.auth2.init({client_id: 'YOUR_CLIENT_ID'});

הרצת הקוד

עכשיו אתם מוכנים לבדוק את הדוגמה:

1. פותחים את הקובץ המקומי מדפדפן אינטרנט, ופותחים את מסוף ניפוי הבאגים בדפדפן. אמור להופיע דף שמוצגים בו שני לחצנים.
2. לוחצים על הלחצן Authorized and load (אישור וטעינה) כדי להפעיל את תהליך ההרשאה של המשתמש. אם נתתם לאפליקציה הרשאה לאחזר את נתוני הערוץ שלכם, אתם אמורים לראות את השורות הבאות מודפסות במסוף בדפדפן:

   Sign-in successful
   GAPI client loaded for API

3. אם במקום הודעת השגיאה שלמעלה מופיעה הודעת שגיאה, ודאו שאתם טוענים את הסקריפט מ-URI ההפניה האוטומטית שהגדרתם לפרויקט ושהצבתם את מזהה הלקוח בקוד כפי שתואר למעלה.
4. לוחצים על הלחצן ביצוע כדי להתקשר ל-API. אתם אמורים לראות בדפדפן אובייקט של הדפסה מהקונסולה response. באובייקט הזה, המאפיין result ממופה לאובייקט שמכיל את נתוני ה-API.

קוד לדוגמה

<script src="https://apis.google.com/js/api.js"></script>
<script>
  function authenticate() {
    return gapi.auth2.getAuthInstance()
        .signIn({scope: "https://www.googleapis.com/auth/yt-analytics.readonly"})
        .then(function() { console.log("Sign-in successful"); },
              function(err) { console.error("Error signing in", err); });
  }
  function loadClient() {
    return gapi.client.load("https://youtubeanalytics.googleapis.com/$discovery/rest?version=v2")
        .then(function() { console.log("GAPI client loaded for API"); },
              function(err) { console.error("Error loading GAPI client for API", err); });
  }
  // Make sure the client is loaded and sign-in is complete before calling this method.
  function execute() {
    return gapi.client.youtubeAnalytics.reports.query({
      "ids": "channel==MINE",
      "startDate": "2017-01-01",
      "endDate": "2017-12-31",
      "metrics": "views,estimatedMinutesWatched,averageViewDuration,averageViewPercentage,subscribersGained",
      "dimensions": "day",
      "sort": "day"
    })
        .then(function(response) {
                // Handle the results here (response.result has the parsed body).
                console.log("Response", response);
              },
              function(err) { console.error("Execute error", err); });
  }
  gapi.load("client:auth2", function() {
    gapi.auth2.init({client_id: 'YOUR_CLIENT_ID'});
  });
</script>
<button onclick="authenticate().then(loadClient)">authorize and load</button>
<button onclick="execute()">execute</button>
yt_analytics_v2.html