Esempi di codice JavaScript

L'esempio di codice riportato di seguito utilizza la libreria client delle API di Google per JavaScript. Puoi scaricare questo esempio dalla cartella javascript del repository di esempio del codice API di YouTube su GitHub.

Il codice richiede l'autorizzazione dell'utente per accedere all'ambito https://www.googleapis.com/auth/yt-analytics.readonly.

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

L'applicazione potrebbe anche richiedere l'accesso ad altri ambiti. Ad esempio, un'applicazione che chiama le API di YouTube Analytics e YouTube Data potrebbe richiedere che gli utenti concedano anche l'accesso ai propri account YouTube. La panoramica di autorizzazione identifica gli ambiti generalmente utilizzati nelle applicazioni che chiamano l'API YouTube Analytics.

Recuperare statistiche giornaliere sul canale

Questo esempio chiama l'API di YouTube Analytics per recuperare le visualizzazioni giornaliere e altre metriche relative al canale dell'utente autorizzato per l'anno solare 2017. Nell'esempio viene utilizzata la libreria client JavaScript delle API di Google.

Configura le credenziali di autorizzazione

Prima di eseguire questo esempio a livello locale per la prima volta, devi configurare le credenziali di autorizzazione per il progetto:

  1. Crea o seleziona un progetto nella console API di Google.
  2. Attivare l'API YouTube Analytics per il tuo progetto.
  3. Nella parte superiore della pagina Credenziali, seleziona la scheda Schermata consenso OAuth. Seleziona un indirizzo email, inserisci il nome di un prodotto, se non è già impostato, e fai clic sul pulsante Salva.
  4. Nella pagina Credenziali, fai clic sul pulsante Crea credenziali e seleziona ID client OAuth.
  5. Seleziona il tipo di applicazione Web.
  6. Nel campo Origini JavaScript autorizzate, inserisci l'URL da cui pubblicherà l'esempio di codice. Ad esempio, potresti utilizzare qualcosa come http://localhost:8000 o http://yourserver.example.com. Puoi lasciare vuoto il campo URI di reindirizzamento autorizzati.
  7. Fai clic sul pulsante Crea per completare la creazione delle credenziali.
  8. Prima di chiudere la finestra di dialogo, copia l'ID client, che dovrai inserire nell'esempio di codice.

Crea una copia locale dell'anteprima

quindi salva l'esempio in un file locale. Nell'esempio, individua la riga seguente e sostituisci YOUR_CLIENT_ID con l'ID client ottenuto durante la configurazione delle credenziali di autorizzazione.

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

Esegui il codice

Ora tutto è pronto per testare l'esempio:

  1. Apri il file locale da un browser web e apri la console di debug nel browser. Dovresti visualizzare una pagina che mostra due pulsanti.
  2. Fai clic sul pulsante Autorizza e carica per avviare il flusso di autorizzazione dell'utente. Se autorizzi l'app a recuperare i dati del tuo canale, dovresti visualizzare le seguenti righe nella console nel browser:
    Sign-in successful
    GAPI client loaded for API
  3. Se vedi un messaggio di errore invece delle righe precedenti, verifica di caricare lo script dall'URI di reindirizzamento autorizzato che hai configurato per il tuo progetto e di inserire il tuo ID client nel codice, come descritto sopra.
  4. Fai clic sul pulsante execute per chiamare l'API. Dovresti vedere una stampa di oggetti response nella console nel browser. In tale oggetto, la proprietà result viene mappata a un oggetto contenente i dati dell'API.

Codice di esempio

<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>