...
✅ Nowości, motywy, wtyczki WEB i WordPress. Tutaj dzielimy się wskazówkami i najlepszymi rozwiązaniami dla stron internetowych.

YouTube API — jak uzyskać listę filmów z YouTube na swoim kanale

123

Ostatnio jeden z naszych czytelników zapytał, jak zdobyć listę filmów z kanału YouTube? Chcieli pokazać listę swoich filmów w formacie tabelarycznym. W tym artykule dowiemy się, jak korzystać z interfejsu API YouTube, aby uzyskać listę filmów YouTube z Twojego kanału.

Użytkownik może zobaczyć wszystkie swoje filmy w samej witrynie YouTube. Ale jeśli chcesz udostępnić listę filmów komuś innemu, musisz zachować te dane w trybie offline. Z drugiej strony niektórzy użytkownicy mogą chcieć wyświetlić listę filmów na swojej stronie internetowej.

Biorąc to pod uwagę, spójrzmy, jak uzyskać listę filmów z YouTube za pomocą interfejsu API YouTube.

Uwaga: Korzystając z kodu tego artykułu, możesz również uzyskać listę filmów dowolnego kanału YouTube, podając prawidłowy identyfikator kanału YouTube.

Uzyskaj klucz API

Aby rozpocząć korzystanie z interfejsu API YouTube, musisz najpierw utworzyć klucz API na swoim koncie Google. Ten klucz jest niezbędny podczas interakcji z interfejsami API YouTube. Bez tego klucza YouTube traktuje wszystkie przychodzące żądania API jako nieautoryzowane.

Wykonaj poniższe czynności, aby utworzyć klucz API.

  • Przejdź do Konsoli programisty Google https://console.developers.google.com.
  • Utwórz nowy projekt. Możesz również wybrać istniejący projekt.
  • Wpisz nazwę swojego projektu. Konsola Google utworzy unikalny identyfikator projektu.
  • Po utworzeniu projektu pojawi się on na górze lewego paska bocznego.
  • Kliknij Biblioteka. Zobaczysz listę interfejsów Google API.
  • Włącz interfejs API danych YouTube.
  • Kliknij poświadczenia. Wybierz klucz API w obszarze Utwórz poświadczenia.
  • Skopiuj klucz API. Za chwilę będzie nam potrzebny.

YouTube API — jak uzyskać listę filmów z YouTube na swoim kanale

Uzyskaj listę filmów z YouTube

Gdy będziesz gotowy z kluczem API, utwórz 3 pliki w swoim projekcie. Te pliki oznaczają konfigurację i metody pomocnicze, obsługę Ajax i wyświetlają wynik końcowy.

  • config.php: W tym pliku ustawiamy klucz API jako stałą. Posiada również metodę pomocniczą, która daje wywołanie API i otrzymuje odpowiedź.
  • ajax.php: Ten plik wywoła API, aby uzyskać następny zestaw wyników, pod warunkiem, że maksymalna liczba wyników zostanie zwrócona.
  • index.php: Zawiera formularz, kod dla połączenia Ajax, wyświetla listę wideo.

W config.phppliku zadeklarujmy klucz API jako zmienną stałą. Definiujemy również metodę pomocnika, która współdziała z punktami końcowymi API.

config.php

<?php
define('GOOGLE_API_KEY', 'PASTE_YOUR_API_KEY');
 
function getYTList($api_url = '') {
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $api_url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    $response = curl_exec($ch);
    $arr_result = json_decode($response);
    if (isset($arr_result->items)) {
        return $arr_result;
    } elseif (isset($arr_result->error)) {
        //var_dump($arr_result); //this line gives you error info if you are not getting a video list.
    }
}

Pamiętaj, aby zastąpić symbol zastępczy rzeczywistym kluczem API. Musisz także mieć włączone rozszerzenie cURL na swoim serwerze.

Utwórz formularz

Następnie potrzebujemy prostego formularza, w którym możemy wpisać identyfikator kanału YouTube i liczbę filmów do zwrócenia. YouTube API zwraca jednocześnie maksymalnie 50 filmów.

index.php

<form method="get">
    <p><input type="text" name="channel" placeholder="Enter Channel ID" value="<?php if(array_key_exists('channel', $_GET)) echo $_GET['channel']; ?>" required></p>
    <p><input type="number" name="max_result" placeholder="Max Results" min="1" max="50" value="<?php if(array_key_exists('max_result', $_GET)) echo $_GET['max_result']; ?>" required></p>
    <p><input type="submit" value="Submit"></p>
</form>

Po przesłaniu formularza przesyłam identyfikator kanału i max_result metodą GET. Więc na górze tego samego pliku napiszę kod w następujący sposób:

<?php
require_once "config.php";
 
$arr_list = array();
if (array_key_exists('channel', $_GET) && array_key_exists('max_result', $_GET)) {
    $channel = $_GET['channel'];
    $url = "https://www.googleapis.com/youtube/v3/search?channelId=$channel&order=date&part=snippet&type=video&maxResults=". $_GET['max_result'] ."&key=". GOOGLE_API_KEY;
    $arr_list = getYTList($url);
}
?>

Ten kod zawiera plik konfiguracyjny, pobiera parametry, buduje adres URL API, a następnie przekazuje go do metody pomocniczej, którą utworzyliśmy w poprzednim kroku. Aby wyświetlić wynik, dodaj poniższy kod po formularzu.

Nie zamierzam skupiać się na projektowaniu listy. Głównym celem samouczka jest pobieranie filmów z YouTube. Wyświetlę to w formie listy.

<?php
if (!empty($arr_list)) {
    echo '<ul class="video-list">';
    foreach ($arr_list->items as $yt) {
        echo "<li>". $yt->snippet->title ." (". $yt->id->videoId .")</li>";
    }
    echo '</ul>';
 
    if (isset($arr_list->nextPageToken)) {
        echo '<input type="hidden" class="nextpagetoken" value="'. $arr_list->nextPageToken .'" />';
        echo '<div id="loadmore">Load More</div>';
    }
}
?>

Tutaj przeglądamy filmy i drukujemy tytuł wideo i identyfikator wideo. Jeśli otrzymamy wartość ‘nextPageToken’ dodajemy ukryte pole i element Load More. Dzieje się tak, ponieważ jeśli masz więcej niż 50 filmów na kanale, możemy uzyskać następny zestaw rekordów przy użyciu tej wartości „nextPageToken". Następnie musimy wywołać Ajax po kliknięciu Load More.

Połączenie Ajaksu

Kiedy klikniemy Load More, wywoła to ajax.phpplik. Ten plik da nam następny zestaw rekordów, który zostanie następnie dołączony do istniejącego wpisu. Napisz poniższy kod JavaScript na końcu index.phppliku.

<script>
var httpRequest, nextPageToken;
document.getElementById("loadmore").addEventListener('click', makeRequest);
function makeRequest() {
    httpRequest = new XMLHttpRequest();
    nextPageToken = document.querySelector('.nextpagetoken').value;
    if (!httpRequest) {
        alert('Giving up: Cannot create an XMLHTTP instance');
        return false;
    }
    httpRequest.onreadystatechange = function(){
        if (this.readyState == 4 && this.status == 200) {
            var list = JSON.parse(this.responseText);
            for(var i in list) {
                if(list[i].title != undefined && list[i].id != undefined) {
                    var newElement = document.createElement('li');
                    newElement.innerHTML = '<li>'+ list[i].title +'('+ list[i].id +')</li>';
                    document.querySelector('.video-list').appendChild(newElement);
                }
            }
 
            if(list[list.length-1].nextPageToken != undefined) {
                document.querySelector('.nextpagetoken').value = list[list.length-1].nextPageToken;
            } else {
                var loadmore = document.getElementById("loadmore");
                loadmore.parentNode.removeChild(loadmore);
            }
        }
    };
    httpRequest.open('GET', 'ajax.php?channel=<?php echo $_GET['channel']; ?>&max_result=<?php echo $_GET['max_result']; ?>&nextPageToken='+nextPageToken, true);
    httpRequest.send();
}
</script>

W tym artykule używam waniliowego JavaScript do wywołania ajax i dołączania odpowiedzi do DOM. Do pliku ajax wysyłam wartości id kanału, max_result i ‘nextPageToken’.

W pliku ajax za pomocą tych parametrów budujemy URL API. Po otrzymaniu odpowiedzi utworzymy obiekt JSON zawierający informacje o filmie i odeślemy go z powrotem. Do końcowego JSON dołączam również wartość „nextPageToken”, aby uzyskać następny zestaw rekordów w kolejnych wywołaniach Ajax.

ajax.php

<?php
require_once "config.php";
 
$url = "https://www.googleapis.com/youtube/v3/search?channelId=". $_GET['channel'] ."&order=date&part=snippet&type=video&maxResults=". $_GET['max_result'] ."&pageToken=". $_GET['nextPageToken'] ."&key=". GOOGLE_API_KEY;
 
$arr_list = getYTList($url);
 
$arr_result = array();
if (!empty($arr_list)) {
    foreach ($arr_list->items as $yt) {
        array_push($arr_result, ['title' => $yt->snippet->title, 'id' => $yt->id->videoId]);
    }
    if (isset($arr_list->nextPageToken)) {
        array_push($arr_result, ['nextPageToken' => $arr_list->nextPageToken]);
    }
}
 
echo json_encode($arr_result);

Nasz kod JavaScript otrzymuje tę odpowiedź JSON i dołącza wynik do istniejącej listy filmów w YouTube. Ten proces trwa, dopóki nie znajdziemy wartości „nextPageToken”.

Mam nadzieję, że rozumiesz, jak uzyskać listę filmów z kanału YouTube. Podziel się swoimi przemyśleniami lub sugestiami w sekcji komentarzy poniżej.

Powiązane artykuły

Źródło nagrywania: artisansweb.net

Ta strona korzysta z plików cookie, aby poprawić Twoje wrażenia. Zakładamy, że nie masz nic przeciwko, ale możesz zrezygnować, jeśli chcesz. Akceptuję Więcej szczegółów