Krótkie wprowadzenie do JavaScriptu

Z tego krótkiego przewodnika dowiesz się, jak skonfigurować prostą stronę, która wysyła żądania do YouTube Data API. W tym krótkim wprowadzeniu wyjaśniamy, jak utworzyć dwa żądania do interfejsu API:

  1. Aby pobrać informacje o kanale Google Developers w YouTube, będziesz używać klucza interfejsu API identyfikującego aplikację.
  2. Identyfikator klienta OAuth 2.0 służy do przesyłania autoryzowanych żądań pobierania informacji o Twoim kanale w YouTube.

Wymagania wstępne

Aby uruchomić ten krótki przewodnik, musisz mieć:

  • Python 2.4 lub nowszy (aby udostępnić serwer WWW)
  • Dostęp do internetu i przeglądarki.
  • Musisz mieć konto Google.

Krok 1. Skonfiguruj projekt i dane logowania

Utwórz lub wybierz projekt w Konsoli interfejsów API. Wykonaj te czynności w konsoli API w projekcie:

  1. W panelu biblioteki wyszukaj YouTube Data API v3. Kliknij informacje o tym interfejsie API i sprawdź, czy jest on włączony w Twoim projekcie.

  2. W panelu danych logowania utwórz 2 dane logowania:

    1. Utwórz klucz interfejsu API. Będziesz używać tego klucza do wykonywania żądań do interfejsu API, które nie wymagają autoryzacji użytkownika. Aby na przykład uzyskać informacje o publicznym kanale YouTube, nie potrzebujesz zgody użytkownika.

    2. Utwórz identyfikator klienta OAuth 2.0 Ustaw typ aplikacji na Aplikacja internetowa. W przypadku żądań wymagających autoryzacji użytkownika musisz używać danych uwierzytelniających OAuth 2.0. Aby na przykład uzyskać informacje o kanale YouTube uwierzytelnionego obecnie, użytkownik musi uzyskać upoważnienie.

      W polu Autoryzowane źródła JavaScript wpisz adres URL http://localhost:8000. Pole Autoryzowane identyfikatory URI przekierowania możesz pozostawić puste.

Krok 2. Skonfiguruj i uruchom próbkę

Użyj widżetu Eksploratora interfejsów API w panelu bocznym, aby pobrać przykładowy kod do pobierania informacji o kanale YouTube dla programistów. To żądanie używa klucza interfejsu API do identyfikowania aplikacji i nie wymaga autoryzacji użytkownika ani żadnych specjalnych uprawnień użytkownika, który uruchomi przykład.

  1. Otwórz dokumentację metody channels.list interfejsu API.

  2. Na tej stronie w sekcji „Typowe przypadki użycia” znajduje się tabela z opisem kilku typowych sposobów użycia metody. Pierwsza pozycja w tabeli zawiera wyniki dotyczące identyfikatora kanału.

    Kliknij symbol kodu pierwszej wizytówki, aby otworzyć i wypełnić eksplorator interfejsów API pełnoekranowego.

    Obraz pokazujący lokalizację linku z symbolem kodu w tabeli, który zawiera listę przypadków użycia w dokumentacji kanału. Tekst alternatywny obrazu identyfikuje ten obraz jako symbol kodu i określa przypadek użycia powiązany z tym linkiem.

  3. Po lewej stronie pełnoekranowego interfejsu API znajdują się następujące informacje:

    1. Pod nagłówkiem Parametry żądania znajduje się lista parametrów obsługiwanych przez daną metodę. Wartości parametrów part i id powinny być ustawione. Wartość parametru id (UC_x5XG1OV2P6uZZ5FSM9Ttw) to identyfikator kanału YouTube Google Developers.

    2. Pod parametrami znajduje się sekcja Dane logowania. Menu rozwijane w tej sekcji powinno zawierać wartość Klucz interfejsu API. Interfejsy API API domyślnie używają danych logowania do wersji demonstracyjnej, aby ułatwić Ci pierwsze kroki. Aby użyć tego przykładowego kodu, musisz użyć własnego klucza interfejsu API.

      Obraz przedstawiający „Dane logowania” w pełnoekranowym Eksploratorze interfejsów API oraz menu z opcją „Klucz interfejsu API”.

  4. Po prawej stronie pełnoekranowego interfejsu API znajdują się karty z przykładowym kodem w różnych językach. Wybierz kartę JavaScript.

  5. Skopiuj przykładowy kod i zapisz go w pliku o nazwie example.html.

  6. W pobranym przykładzie znajdź ciąg znaków YOUR_API_KEY i zastąp go kluczem interfejsu API utworzonym w kroku 1 tego krótkiego wprowadzenia.

  7. Uruchom serwer WWW za pomocą tego polecenia z katalogu roboczego:

    Python 2.x

    python -m SimpleHTTPServer 8000

    Python 3.x

    python -m http.server 8000

  8. Otwórz plik example.html w przeglądarce. Otwórz też narzędzia dla programistów w przeglądarce Chrome, np. „Narzędzia dla deweloperów”.

    1. Kliknij na stronie przycisk load, aby wczytać Bibliotekę klienta interfejsów API Google dla JavaScriptu. Gdy klikniesz przycisk, konsola programisty powinna wyświetlić informację, że klient GAPI został wczytany.

    2. Kliknij przycisk Uruchom, aby wysłać żądanie do interfejsu API. Konsola dewelopera powinna wyświetlić odpowiedź interfejsu API.

Krok 3. Uruchom autoryzowane żądanie

W tym kroku zmodyfikujesz przykładowy kod, aby zamiast pobierania informacji o kanale YouTube dla programistów Google pobierał informacje o Twoim kanale w YouTube. To żądanie nie wymaga autoryzacji użytkownika.

  1. Wróć do dokumentacji metody channels.list interfejsu API.

  2. W sekcji „Typowe przypadki użycia” kliknij symbol kodu trzeciej listy w tabeli. Twój przypadek użycia to wywołać metodę list dla „mojego kanału”.

  3. Po lewej stronie pełnoekranowego interfejsu API Eksploratora zobaczysz listę parametrów i sekcję Dane logowania. Są jednak 2 zmiany w tym przykładzie:

    1. W sekcji parametrów zamiast wartości parametru id ustaw wartość mine na true. Dzięki temu serwer API otrzyma informacje o kanale użytkownika, który jest obecnie uwierzytelniony.

    2. W sekcji Dane logowania należy wybrać opcję Google OAuth 2.0.

      Dodatkowo, jeśli klikniesz link Pokaż zakresy, musisz zaznaczyć zakres https://www.googleapis.com/auth/youtube.readonly.

      Obraz pokazujący zakresy w eksploratorze interfejsów API pełnoekranowego oraz możliwość użycia danych logowania „Google OAuth 2.0”.

  4. Podobnie jak w poprzednim przykładzie, wybierz kartę JavaScript, skopiuj przykładowy kod i zapisz go w example.html.

    W kodzie znajdź ciąg YOUR_CLIENT_ID i zastąp go identyfikatorem klienta utworzonym w kroku 1 tego krótkiego wprowadzenia.

  5. Uruchom serwer WWW za pomocą tego polecenia z katalogu roboczego:

    Python 2.x

    python -m SimpleHTTPServer 8000

    Python 3.x

    python -m http.server 8000

  6. W przeglądarce otwórz plik http://localhost:8000/example.html. Otwórz narzędzia dla programistów w przeglądarce Chrome, np. „Narzędzia dla deweloperów”.

  7. Kliknij przycisk autoryzuj i wczytaj na stronie, aby wczytać Bibliotekę klienta interfejsów API Google dla JavaScriptu i rozpocząć proces autoryzacji. Pojawi się prośba o przyznanie aplikacji uprawnień do odczytu danych z Twojego konta YouTube.

    Jeśli przyznasz te uprawnienia, w konsoli programisty powinny być wyświetlane komunikaty z informacją, że logowanie się powiodło i że klient API został wczytany.

  8. Kliknij przycisk Uruchom, aby wysłać żądanie do interfejsu API. Konsola dewelopera powinna wyświetlić odpowiedź interfejsu API.

Więcej informacji