API di YouTube – Come ottenere l’elenco dei video di YouTube del tuo canale

Last updated Ott 18, 2021

Contenuto

Ottieni la tua chiave API

Per iniziare con l’API di YouTube, devi prima creare una chiave API dal tuo account Google. Questa chiave è necessaria durante l’interazione con le API di YouTube. Senza questa chiave YouTube considera non autorizzate tutte le richieste API in entrata.

Segui i passaggi seguenti per creare una chiave API.

Vai alla Console per gli sviluppatori di Google https://console.developers.google.com.
Crea un nuovo progetto. Puoi anche selezionare un progetto esistente.
Digita un nome per il tuo progetto. Google Console creerà un ID progetto univoco.
Dopo aver creato un progetto, apparirà nella parte superiore della barra laterale sinistra.
Fare clic su Libreria. Vedrai l’elenco delle API di Google.
Abilita l’API dati di YouTube.
Fare clic su Credenziali. Seleziona la chiave API in Crea credenziali.
Copia la chiave API. Ne avremo bisogno tra un momento.

Ottieni un elenco di video di YouTube

Una volta che sei pronto con la chiave API, crea 3 file nel tuo progetto. Questi file rappresentano i metodi di configurazione e di supporto, la gestione di Ajax e visualizzano il risultato finale.

config.php: In questo file impostiamo la chiave API come costante. Ha anche un metodo di supporto che fornisce una chiamata API e riceve una risposta.
ajax.php: questo file chiamerà l’API per ottenere la serie successiva di risultati forniti massimi risultati da restituire.
index.php: Contiene un modulo, codice per chiamata Ajax, visualizza l’elenco dei video.

Nel config.phpfile, dichiariamo la chiave API come una variabile costante. Definiamo anche il metodo di supporto che interagisce con gli endpoint 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.
    }
}

Assicurati di sostituire il segnaposto con la chiave API effettiva. Devi anche avere l’estensione cURL abilitata sul tuo server.

Crea un modulo

Successivamente, abbiamo bisogno di un semplice modulo in cui possiamo inserire l’ID del canale YouTube e il numero di video da restituire. L’API di YouTube restituisce un massimo di 50 video alla volta.

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>

Al momento dell’invio del modulo, sto inviando l’id del canale e max_result con il metodo GET. Quindi nella parte superiore dello stesso file, scriverò il codice come segue:

<?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);
}
?>

Questo codice include un file di configurazione, ottiene i parametri, crea un URL API e quindi lo passa al metodo di supporto creato nel passaggio precedente. Per visualizzare il risultato aggiungi il codice seguente dopo il modulo.

Non mi concentrerò sulla progettazione di un elenco. Lo scopo principale del tutorial è recuperare i video di YouTube. Lo visualizzerò nel formato elenco.

<?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>';
    }
}
?>

Qui stiamo scorrendo i video e stampando il titolo e l’id del video. Se otteniamo il valore di ‘nextPageToken’ stiamo aggiungendo un campo nascosto e l’elemento Load More. Questo perché se hai più di 50 video sul canale, possiamo ottenere il prossimo set di record utilizzando questo valore "nextPageToken". Dopodiché, dobbiamo effettuare una chiamata Ajax al clic del pulsante Carica altro.

Chiamata Ajax

Quando facciamo clic su Carica altro, verrà chiamato il ajax.phpfile. Questo file ci darà il prossimo set di record che verrà poi aggiunto all’elenco esistente. Scrivi il codice JavaScript sottostante alla fine del index.phpfile.

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

Per questo articolo, sto usando JavaScript vaniglia per la chiamata ajax e aggiungendo la risposta al DOM. Al file ajax sto inviando i valori di channel id, max_result e ‘nextPageToken’.

Nel file ajax con l’aiuto di questi parametri, creiamo l’URL dell’API. Dopo aver ricevuto una risposta, creeremo un oggetto JSON contenente informazioni sul video e lo rispediremo. Al JSON finale, sto anche aggiungendo un valore "nextPageToken" per ottenere il prossimo set di record sulle successive chiamate 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);

Il nostro codice JavaScript riceve questa risposta JSON e aggiunge il risultato all’elenco esistente di video di YouTube. Questo processo continua finché non troviamo il valore per ‘nextPageToken’.

Spero che tu capisca come ottenere un elenco di video di un canale YouTube. Si prega di condividere i tuoi pensieri o suggerimenti nella sezione commenti qui sotto.

API di YouTube – Come ottenere l’elenco dei video di YouTube del tuo canale

Ottieni la tua chiave API

Ottieni un elenco di video di YouTube

Crea un modulo

Chiamata Ajax

articoli Correlati