YouTubeプレイリストの動画一覧取得サンプル

https://www.youtube.com/playlist?list=PLSx6MdBnoFbC5QUH7Z2kR16Js51w-5yTZ から取得

<script>
function onGoogleLoad() {
  gapi.client.setApiKey('AIzaSyBkA8ZXf8VLLNt9CBl8c9IPD771_cmfGeg');
  gapi.client.load('youtube', 'v3', function() {
    var result = document.getElementById('result');
    var request = gapi.client.youtube.playlistItems.list({
      playlistId: 'PLSx6MdBnoFbC5QUH7Z2kR16Js51w-5yTZ',
      part: 'snippet,contentDetails',
      maxResults: 3,
    });
    request.execute(function(response) {
      var html = [];
      for (var i = 0; i < response.items.length; i++) {
        var snippet = response.items[i].snippet;
				var videoId = snippet.resourceId.videoId;
        var videoPublishedAt = response.items[i].contentDetails.videoPublishedAt;
        html.push(`
          <li>
          videoId: ${videoId}<br>
          title: ${snippet.title}<br>
          videoPublishedAt: ${new Date(videoPublishedAt).toLocaleString()}<br>
          <iframe width="280" height="157" src="https://www.youtube.com/embed/${videoId}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
          </li>
        `);
      }
      result.innerHTML = html.join('');
    });
  });
}
</script>
<script src="https://apis.google.com/js/client.js?onload=onGoogleLoad"></script>

元記事を表示する