JavaScript Kod Örnekleri

Aşağıdaki kod örneği JavaScript için Google API'leri İstemci Kitaplığı'nı kullanmaktadır. Bu örneği, GitHub'daki YouTube API'leri kod örneği deposunun javascript klasöründen indirebilirsiniz.

Kod, https://www.googleapis.com/auth/yt-analytics.readonly kapsamına erişmek için kullanıcının iznini ister.

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

Uygulamanızın diğer kapsamlara da erişim istemesi gerekebilir. Örneğin, YouTube Analytics API ve YouTube Data API'yi çağıran bir uygulamanın, kullanıcıların YouTube hesaplarına da erişim izni vermesi gerekebilir. Yetkilendirmeye genel bakış, genellikle YouTube Analytics API'sini çağıran uygulamalarda kullanılan kapsamları tanımlar.

Günlük kanal istatistiklerini al

Bu örnekte YouTube Analytics API'si, 2017 takvim yılında kullanıcının kanalı için geçerli olan görüntüleme sayısı ve diğer metrikleri alır. Örnekte Google API'leri JavaScript istemci kitaplığı kullanılmaktadır.

Yetkilendirme kimlik bilgilerini ayarlayın

Bu örneği ilk kez yerel olarak çalıştırmadan önce projeniz için yetkilendirme kimlik bilgilerini ayarlamanız gerekir:

  1. Google API Konsolu'nda proje oluşturun veya seçin.
  2. Projeniz için YouTube Analytics API'yi etkinleştirin.
  3. Kimlik bilgileri sayfasının üst kısmında OAuth izin ekranı sekmesini seçin. Bir e-posta adresi seçin, ayarlanmamışsa ürün adını girin ve Kaydet düğmesini tıklayın.
  4. Kimlik bilgileri sayfasında Kimlik bilgisi oluştur düğmesini tıklayın ve Oauth istemci kimliği'ni seçin.
  5. Web uygulaması uygulama türünü seçin.
  6. Yetkili JavaScript kaynakları alanına, kod örneğini sunacağınız URL'yi girin. Örneğin, http://localhost:8000 veya http://yourserver.example.com gibi bir şey kullanabilirsiniz. Yetkilendirilmiş yönlendirme URI'leri alanını boş bırakabilirsiniz.
  7. Kimlik bilgilerinizi oluşturma işlemini tamamlamak için Oluştur düğmesini tıklayın.
  8. İletişim kutusunu kapatmadan önce, kod örneğine eklemeniz gereken istemci kimliğini kopyalayın.

Örneğin yerel bir kopyasını oluşturun

Ardından, örneği yerel bir dosyaya kaydedin. Örnekte aşağıdaki satırı bulup yetkilendirme kimlik bilgilerinizi ayarlarken edindiğiniz istemci kimliğiyle YOUR_CLIENT_ID değerini değiştirin.

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

Kodu çalıştır

Artık örneği test etmeye hazırsınız:

  1. Yerel dosyayı bir web tarayıcısından açın ve tarayıcıda hata ayıklama konsolunu açın. İki düğme gösteren bir sayfa görürsünüz.
  2. Kullanıcı yetkilendirme akışını başlatmak için Yetkilendir ve yükle düğmesini tıklayın. Uygulamanın kanal verilerinizi alması için yetkilendirirseniz aşağıdaki satırların tarayıcıda konsola yazdırıldığını görürsünüz:
    Sign-in successful
    GAPI client loaded for API
  3. Yukarıdaki satırlar yerine bir hata mesajı görürseniz komut dosyasını projeniz için ayarladığınız yetkili yönlendirme URI'sinden yüklediğinizi ve istemci kimliğinizi yukarıda açıklandığı şekilde koda yerleştirdiğinizi onaylayın.
  4. API'yi çağırmak için Yürüt düğmesini tıklayın. Tarayıcıda konsola bir response nesnesi yazdırılması gerekir. Bu nesnede, result özelliği API verilerini içeren bir nesneyle eşlenir.

Örnek kod

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