{"id":24997,"date":"2021-05-29T15:08:00","date_gmt":"2021-05-29T12:08:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=24997"},"modified":"2021-10-18T02:35:59","modified_gmt":"2021-10-17T23:35:59","slug":"youtube-api-so-erhalten-sie-eine-liste-der-youtube-videos-ihres-kanals","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/de\/youtube-api-so-erhalten-sie-eine-liste-der-youtube-videos-ihres-kanals\/","title":{"rendered":"YouTube API &#8211; So erhalten Sie eine Liste der YouTube-Videos Ihres Kanals"},"content":{"rendered":"<p>K\u00fcrzlich hat einer unserer Leser gefragt, wie man eine Liste der Videos eines YouTube-Kanals erh\u00e4lt? Sie wollten eine Liste ihrer Videos in tabellarischer Form anzeigen. In diesem Artikel untersuchen wir, wie Sie die YouTube-API verwenden, um eine Liste der YouTube-Videos Ihres Kanals zu erhalten.<\/p>\n<p>Ein Benutzer kann alle seine Videos auf der YouTube-Website selbst sehen. Wenn Sie die Videoliste jedoch mit jemand anderem teilen m\u00f6chten, m\u00fcssen Sie diese Daten offline halten. Auf der anderen Seite m\u00f6chten einige Benutzer m\u00f6glicherweise eine Videoliste auf ihrer Website anzeigen.<\/p>\n<p>Sehen wir uns jedoch an, wie Sie mithilfe der YouTube-API eine Liste von YouTube-Videos abrufen k\u00f6nnen.<\/p>\n<p><strong>Hinweis:<\/strong> Mit dem Code dieses Artikels k\u00f6nnen Sie auch eine Liste der Videos eines beliebigen YouTube-Kanals mit einer g\u00fcltigen YouTube-Kanal-ID abrufen.<\/p>\n<h3>Holen Sie sich Ihren API-Schl\u00fcssel<\/h3>\n<p>Um mit der YouTube-API zu beginnen, m\u00fcssen Sie zun\u00e4chst einen API-Schl\u00fcssel aus Ihrem Google-Konto erstellen. Dieser Schl\u00fcssel ist bei der Interaktion mit den YouTube-APIs erforderlich. Ohne diesen Schl\u00fcssel betrachtet YouTube alle eingehenden API-Anfragen als nicht autorisiert.<\/p>\n<p>F\u00fchren Sie die folgenden Schritte aus, um einen API-Schl\u00fcssel zu erstellen.<\/p>\n<ul>\n<li>Gehen Sie zur Google-Entwicklerkonsole <a href=\"https:\/\/console.developers.google.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external\"><\/a><a href=\"https:\/\/console.developers.google.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">https:\/\/console.developers.google.com<\/a>.<\/li>\n<li>Erstellen Sie ein neues Projekt. Sie k\u00f6nnen auch ein vorhandenes Projekt ausw\u00e4hlen.<\/li>\n<li>Geben Sie einen Namen f\u00fcr Ihr Projekt ein. Die Google Console erstellt eine eindeutige Projekt-ID.<\/li>\n<li>Nachdem Sie ein Projekt erstellt haben, wird es oben in der linken Seitenleiste angezeigt.<\/li>\n<li>Klicken Sie auf Bibliothek. Sie sehen eine Liste der Google APIs.<\/li>\n<li>Aktivieren Sie die YouTube-Daten-API.<\/li>\n<li>Klicken Sie auf die Anmeldeinformationen. W\u00e4hlen Sie API-Schl\u00fcssel unter Anmeldeinformationen erstellen aus.<\/li>\n<li>Kopieren Sie den API-Schl\u00fcssel. Wir werden es gleich brauchen.<\/li>\n<\/ul>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20424-6081ef644e221.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20424-6081ef644e221.png\" alt=\"YouTube API - So erhalten Sie eine Liste der YouTube-Videos Ihres Kanals\" ><\/a><\/p>\n<h3>Holen Sie sich eine Liste von YouTube-Videos<\/h3>\n<p>Sobald Sie mit dem API-Schl\u00fcssel fertig sind, erstellen Sie 3 Dateien in Ihrem Projekt. Diese Dateien stehen f\u00fcr Konfigurations- und Hilfsmethoden, Ajax-Handling und zeigen das Endergebnis an.<\/p>\n<ul>\n<li><code>config.php<\/code>: In dieser Datei setzen wir den API-Schl\u00fcssel als Konstante. Es hat auch eine Hilfsmethode, die einen API-Aufruf ausgibt und eine Antwort empf\u00e4ngt.<\/li>\n<li><code>ajax.php<\/code>: Diese Datei ruft die API auf, um den n\u00e4chsten Satz von Ergebnissen zu erhalten, sofern die maximalen Ergebnisse zur\u00fcckgegeben werden.<\/li>\n<li><code>index.php<\/code>: Es enth\u00e4lt ein Formular, Code f\u00fcr Ajax-Anrufe, zeigt die Videoliste an.<\/li>\n<\/ul>\n<p>In der <code>config.php<\/code>Datei deklarieren wir den API-Schl\u00fcssel als konstante Variable. Wir definieren auch die Hilfsmethode, die mit den API-Endpunkten interagiert.<\/p>\n<p><strong>config.php<\/strong><\/p>\n<pre><code>&lt;?php\ndefine('GOOGLE_API_KEY', 'PASTE_YOUR_API_KEY');\n\u00a0\nfunction getYTList($api_url = '') {\n\u00a0\u00a0\u00a0\u00a0$ch = curl_init();\n\u00a0\u00a0\u00a0\u00a0curl_setopt($ch, CURLOPT_URL, $api_url);\n\u00a0\u00a0\u00a0\u00a0curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);\n\u00a0\u00a0\u00a0\u00a0$response = curl_exec($ch);\n\u00a0\u00a0\u00a0\u00a0$arr_result = json_decode($response);\n\u00a0\u00a0\u00a0\u00a0if (isset($arr_result-&gt;items)) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return $arr_result;\n\u00a0\u00a0\u00a0\u00a0} elseif (isset($arr_result-&gt;error)) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/var_dump($arr_result); \/\/this line gives you error info if you are not getting a video list.\n\u00a0\u00a0\u00a0\u00a0}\n}<\/code><\/pre>\n<p>Stellen Sie sicher, dass Sie den Platzhalter durch den tats\u00e4chlichen API-Schl\u00fcssel ersetzen. Au\u00dferdem muss die cURL-Erweiterung auf Ihrem Server aktiviert sein.<\/p>\n<h4>Erstellen Sie ein Formular<\/h4>\n<p>Als n\u00e4chstes ben\u00f6tigen wir ein einfaches Formular, in das wir die YouTube-Kanal-ID und die Anzahl der zur\u00fcckzugebenden Videos eingeben k\u00f6nnen. Die YouTube API gibt maximal 50 Videos gleichzeitig zur\u00fcck.<\/p>\n<p><strong>index.php<\/strong><\/p>\n<pre><code>&lt;form method=\"get\"&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;p&gt;&lt;input type=\"text\" name=\"channel\" placeholder=\"Enter Channel ID\" value=\"&lt;?php if(array_key_exists('channel', $_GET)) echo $_GET['channel']; ?&gt;\" required&gt;&lt;\/p&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;p&gt;&lt;input type=\"number\" name=\"max_result\" placeholder=\"Max Results\" min=\"1\" max=\"50\" value=\"&lt;?php if(array_key_exists('max_result', $_GET)) echo $_GET['max_result']; ?&gt;\" required&gt;&lt;\/p&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;p&gt;&lt;input type=\"submit\" value=\"Submit\"&gt;&lt;\/p&gt;\n&lt;\/form&gt;<\/code><\/pre>\n<p>Beim Absenden des Formulars sende ich die Kanal-ID und das max_result mit der GET-Methode. Am Anfang derselben Datei schreibe ich den Code wie folgt:<\/p>\n<pre><code>&lt;?php\nrequire_once \"config.php\";\n\u00a0\n$arr_list = array();\nif (array_key_exists('channel', $_GET) &amp;&amp; array_key_exists('max_result', $_GET)) {\n\u00a0\u00a0\u00a0\u00a0$channel = $_GET['channel'];\n\u00a0\u00a0\u00a0\u00a0$url = \"https:\/\/www.googleapis.com\/youtube\/v3\/search?channelId=$channel&amp;order=date&amp;part=snippet&amp;type=video&amp;maxResults=\". $_GET['max_result'] .\"&amp;key=\". GOOGLE_API_KEY;\n\u00a0\u00a0\u00a0\u00a0$arr_list = getYTList($url);\n}\n?&gt;<\/code><\/pre>\n<p>Dieser Code enth\u00e4lt eine Konfigurationsdatei, ruft die Parameter ab, erstellt eine API-URL und \u00fcbergibt sie dann an die im vorherigen Schritt erstellte Hilfsmethode. Um das Ergebnis anzuzeigen, f\u00fcgen Sie den folgenden Code nach Ihrem Formular hinzu.<\/p>\n<p>Ich werde mich nicht auf das Design einer Liste konzentrieren. Der Hauptzweck des Tutorials besteht darin, YouTube-Videos abzurufen. Ich werde es im Listenformat anzeigen.<\/p>\n<pre><code>&lt;?php\nif (!empty($arr_list)) {\n\u00a0\u00a0\u00a0\u00a0echo '&lt;ul class=\"video-list\"&gt;';\n\u00a0\u00a0\u00a0\u00a0foreach ($arr_list-&gt;items as $yt) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo \"&lt;li&gt;\". $yt-&gt;snippet-&gt;title .\" (\". $yt-&gt;id-&gt;videoId .\")&lt;\/li&gt;\";\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0echo '&lt;\/ul&gt;';\n\u00a0\n\u00a0\u00a0\u00a0\u00a0if (isset($arr_list-&gt;nextPageToken)) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo '&lt;input type=\"hidden\" class=\"nextpagetoken\" value=\"'. $arr_list-&gt;nextPageToken .'\" \/&gt;';\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo '&lt;div id=\"loadmore\"&gt;Load More&lt;\/div&gt;';\n\u00a0\u00a0\u00a0\u00a0}\n}\n?&gt;<\/code><\/pre>\n<p>Hier durchlaufen wir die Videos und drucken den Videotitel und die Video-ID aus. Wenn wir den Wert von &#8217;nextPageToken&#8216; erhalten, f\u00fcgen wir ein verstecktes Feld und ein Load More Element hinzu. Dies liegt daran, dass wir mit diesem &#8217;nextPageToken&#8216;-Wert die n\u00e4chsten Datens\u00e4tze abrufen k\u00f6nnen, wenn Sie mehr als 50 Videos auf dem Kanal haben. Danach m\u00fcssen wir beim Klicken auf \u201eLoad More&#8220; einen Ajax-Aufruf t\u00e4tigen.<\/p>\n<h4>Ajax-Anruf<\/h4>\n<p>Wenn wir auf Mehr laden klicken, wird die <code>ajax.php<\/code>Datei aufgerufen. Diese Datei liefert uns die n\u00e4chsten Datens\u00e4tze, die dann an die vorhandene Auflistung angeh\u00e4ngt werden. Schreiben Sie den folgenden JavaScript-Code am Ende der <code>index.php<\/code>Datei.<\/p>\n<pre><code>&lt;script&gt;\nvar httpRequest, nextPageToken;\ndocument.getElementById(\"loadmore\").addEventListener('click', makeRequest);\nfunction makeRequest() {\n\u00a0\u00a0\u00a0\u00a0httpRequest = new XMLHttpRequest();\n\u00a0\u00a0\u00a0\u00a0nextPageToken = document.querySelector('.nextpagetoken').value;\n\u00a0\u00a0\u00a0\u00a0if (!httpRequest) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0alert('Giving up: Cannot create an XMLHTTP instance');\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return false;\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0httpRequest.onreadystatechange = function(){\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (this.readyState == 4 &amp;&amp; this.status == 200) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0var list = JSON.parse(this.responseText);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0for(var i in list) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if(list[i].title != undefined &amp;&amp; list[i].id != undefined) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0var newElement = document.createElement('li');\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0newElement.innerHTML = '&lt;li&gt;'+ list[i].title +'('+ list[i].id +')&lt;\/li&gt;';\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0document.querySelector('.video-list').appendChild(newElement);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if(list[list.length-1].nextPageToken != undefined) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0document.querySelector('.nextpagetoken').value = list[list.length-1].nextPageToken;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0} else {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0var loadmore = document.getElementById(\"loadmore\");\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0loadmore.parentNode.removeChild(loadmore);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0};\n\u00a0\u00a0\u00a0\u00a0httpRequest.open('GET', 'ajax.php?channel=&lt;?php echo $_GET['channel']; ?&gt;&amp;max_result=&lt;?php echo $_GET['max_result']; ?&gt;&amp;nextPageToken='+nextPageToken, true);\n\u00a0\u00a0\u00a0\u00a0httpRequest.send();\n}\n&lt;\/script&gt;<\/code><\/pre>\n<p>F\u00fcr diesen Artikel verwende ich Vanille-JavaScript f\u00fcr den Ajax-Aufruf und h\u00e4nge die Antwort an das DOM an. An die Ajax-Datei sende ich die Werte der Kanal-ID, max_result und &#8217;nextPageToken&#8216;.<\/p>\n<p>In der Ajax-Datei bauen wir mit Hilfe dieser Parameter die API-URL. Nach Erhalt einer Antwort erstellen wir ein JSON-Objekt mit Videoinformationen und senden es zur\u00fcck. An das letzte JSON h\u00e4nge ich auch einen &#8217;nextPageToken&#8216;-Wert an, um die n\u00e4chsten Datens\u00e4tze bei nachfolgenden Ajax-Aufrufen abzurufen.<\/p>\n<p><strong>ajax.php<\/strong><\/p>\n<pre><code>&lt;?php\nrequire_once \"config.php\";\n\u00a0\n$url = \"https:\/\/www.googleapis.com\/youtube\/v3\/search?channelId=\". $_GET['channel'] .\"&amp;order=date&amp;part=snippet&amp;type=video&amp;maxResults=\". $_GET['max_result'] .\"&amp;pageToken=\". $_GET['nextPageToken'] .\"&amp;key=\". GOOGLE_API_KEY;\n\u00a0\n$arr_list = getYTList($url);\n\u00a0\n$arr_result = array();\nif (!empty($arr_list)) {\n\u00a0\u00a0\u00a0\u00a0foreach ($arr_list-&gt;items as $yt) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0array_push($arr_result, ['title' =&gt; $yt-&gt;snippet-&gt;title, 'id' =&gt; $yt-&gt;id-&gt;videoId]);\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0if (isset($arr_list-&gt;nextPageToken)) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0array_push($arr_result, ['nextPageToken' =&gt; $arr_list-&gt;nextPageToken]);\n\u00a0\u00a0\u00a0\u00a0}\n}\n\u00a0\necho json_encode($arr_result);<\/code><\/pre>\n<p>Unser JavaScript-Code empf\u00e4ngt diese JSON-Antwort und h\u00e4ngt das Ergebnis an die vorhandene Liste von YouTube-Videos an. Dieser Vorgang wird fortgesetzt, bis wir den Wert f\u00fcr &#8217;nextPageToken&#8216; gefunden haben.<\/p>\n<p>Ich hoffe, Sie verstehen, wie Sie eine Liste der Videos eines YouTube-Kanals erhalten. Bitte teilen Sie Ihre Gedanken oder Vorschl\u00e4ge im Kommentarbereich unten mit.<\/p>\n<h4>Zum Thema passende Artikel<\/h4>\n<ul>\n<li><a href=\"https:\/\/themewp.inform.click\/de\/so-verwenden-sie-die-youtube-api-zum-hochladen-von-videos-auf-dem-youtube-kanal\/\" title=\"So verwenden Sie die YouTube-API zum Hochladen von Videos auf dem YouTube-Kanal\">So verwenden Sie die YouTube-API zum Hochladen von Videos auf dem YouTube-Kanal<\/a><\/li>\n<li><a href=\"https:\/\/themewp.inform.click\/de\/youtube-videoliste-nach-schluesselwoertern-mithilfe-der-youtube-such-api-abrufen\/\" title=\"So erhalten Sie eine YouTube-Videoliste nach Schl\u00fcsselw\u00f6rtern mit der YouTube-Such-API\">So erhalten Sie eine YouTube-Videoliste nach Schl\u00fcsselw\u00f6rtern mit der YouTube-Such-API<\/a><\/li>\n<li><a href=\"https:\/\/themewp.inform.click\/de\/so-fugen-sie-google-oauth-login-in-website-mit-php-hinzu\/\" title=\"So f\u00fcgen Sie Google OAuth-Login in Website mit PHP hinzu\">So f\u00fcgen Sie Google OAuth-Login in Website mit PHP hinzu<\/a><\/li>\n<\/ul>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Aufnahmequelle:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/artisansweb.net\" class=\"external external_icon\">artisansweb.net<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>In diesem Artikel untersuchen wir, wie Sie mithilfe der YouTube-API eine Liste von YouTube-Videos erhalten. Vielleicht m\u00f6chten Sie eine Liste von Videos, um sie auf einer Website anzuzeigen<\/p>\n","protected":false},"author":1,"featured_media":21640,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[272],"tags":[845],"class_list":["post-24997","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-php-3","tag-affiai-de"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts\/24997","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/comments?post=24997"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts\/24997\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/media\/21640"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/media?parent=24997"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/categories?post=24997"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/tags?post=24997"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}