Как получить миниатюру видео YouTube из API YouTube?

можно использовать API данных YouTube для получения миниатюр видео, подписи, описания, рейтинга, статистики и многое другое. Для API версии 3 требуется ключ*. Получите ключ и создайте видео: запрос:

https://www.googleapis.com/youtube/v3/videos?key=YOUR_API_KEY&part=snippet&id=VIDEO_ID

пример кода PHP

$data = file_get_contents("https://www.googleapis.com/youtube/v3/videos?key=YOUR_API_KEY&part=snippet&id=T0Jqdjbed40");
$json = json_decode($data);
var_dump($json->items[0]->snippet->thumbnails);

выход

object(stdClass)#5 (5) {
  ["default"]=>
  object(stdClass)#6 (3) {
    ["url"]=>
    string(46) "https://i.ytimg.com/vi/T0Jqdjbed40/default.jpg"
    ["width"]=>
    int(120)
    ["height"]=>
    int(90)
  }
  ["medium"]=>
  object(stdClass)#7 (3) {
    ["url"]=>
    string(48) "https://i.ytimg.com/vi/T0Jqdjbed40/mqdefault.jpg"
    ["width"]=>
    int(320)
    ["height"]=>
    int(180)
  }
  ["high"]=>
  object(stdClass)#8 (3) {
    ["url"]=>
    string(48) "https://i.ytimg.com/vi/T0Jqdjbed40/hqdefault.jpg"
    ["width"]=>
    int(480)
    ["height"]=>
    int(360)
  }
  ["standard"]=>
  object(stdClass)#9 (3) {
    ["url"]=>
    string(48) "https://i.ytimg.com/vi/T0Jqdjbed40/sddefault.jpg"
    ["width"]=>
    int(640)
    ["height"]=>
    int(480)
  }
  ["maxres"]=>
  object(stdClass)#10 (3) {
    ["url"]=>
    string(52) "https://i.ytimg.com/vi/T0Jqdjbed40/maxresdefault.jpg"
    ["width"]=>
    int(1280)
    ["height"]=>
    int(720)
  }
}

* мало того, что вам нужен ключ, вам может потребоваться платежная информация в зависимости от количество запросов API, которые вы планируете сделать. Однако несколько миллионов запросов в день являются бесплатными.

статьи.

то, что сказал Асаф, верно. Однако не каждое видео YouTube содержит все девять эскизов, но для каждого видео есть семь эскизов. Они:

(размер изображения зависит от видео.)

• миниатюра фона проигрывателя (480x360 пикселей)
  https://i1.ytimg.com/vi/G0wGs3useV8/0.jpg

• запустить миниатюру (120x90 пикселей)
  https://i1.ytimg.com/vi/G0wGs3useV8/1.jpg

• средний эскиз (120x90 пиксели)
  https://i1.ytimg.com/vi/G0wGs3useV8/2.jpg

• конец миниатюры (120x90 пикселей)
  https://i1.ytimg.com/vi/G0wGs3useV8/3.jpg

• высокое качество миниатюр (480x360 пикселей)
  https://i1.ytimg.com/vi/G0wGs3useV8/hqdefault.jpg

• миниатюра среднего качества (320x180 пикселей)
  https://i1.ytimg.com/vi/G0wGs3useV8/mqdefault.jpg

• эскиз нормального качества (120x90 пикселей)
  https://i1.ytimg.com/vi/G0wGs3useV8/default.jpg

и, кроме того, следующие два миниатюры могут или не могут существовать. Для HQ видео они существуют.

• эскиз стандартного определения (640x480 пикселей)
  https://i1.ytimg.com/vi/G0wGs3useV8/sddefault.jpg

• максимальное разрешение миниатюры (1920x1080 пикселей)
  https://i1.ytimg.com/vi/G0wGs3useV8/maxresdefault.jpg

вы можете получить сценарии JavaScript и PHP для получения эскизов и других Информация на YouTube

• как получить информацию о видео YouTube с помощью PHP
• Получить YouTube Видео Детали использование JavaScript-JSON & API v2

также используйте инструмент Генератор Видеоинформации YouTube чтобы получить все информация о видео YouTube, отправив URL-адресом или ID видео.

в YouTube API V3 мы также можем использовать эти URL-адреса для получения эскизов... Они классифицируются на основе их качества.

https://i1.ytimg.com/vi/<insert-youtube-video-id-here>/default.jpg -   default
https://i1.ytimg.com/vi/<insert-youtube-video-id-here>/mqdefault.jpg - medium 
https://i1.ytimg.com/vi/<insert-youtube-video-id-here>/hqdefault.jpg - high
https://i1.ytimg.com/vi/<insert-youtube-video-id-here>/sddefault.jpg - standard

и для максимального разрешения..

https://i1.ytimg.com/vi/<insert-youtube-video-id-here>/maxresdefault.jpg

одним из преимуществ этих URL-адресов над URL-адресами в первом ответе является то, что эти URL-адреса не блокируются брандмауэрами.

Если вы хотите самое большое изображение с YouTube для определенного идентификатора видео, то URL должен быть примерно таким:

http://i3.ytimg.com/vi/SomeVideoIDHere/0.jpg

используя API, вы можете выбрать изображение миниатюры по умолчанию. Простой код должен быть примерно таким:

//Grab the default thumbnail image
$attrs = $media->group->thumbnail[1]->attributes();
$thumbnail = $attrs['url'];
$thumbnail = substr($thumbnail, 0, -5);
$thumb1 = $thumbnail."default.jpg";

// Grab the third thumbnail image
$thumb2 = $thumbnail."2.jpg";

// Grab the fourth thumbnail image.
$thumb3 = $thumbnail."3.jpg";

// Using simple cURL to save it your server.
// You can extend the cURL below if you want it as fancy, just like
// the rest of the folks here.

$ch = curl_init ("$thumb1");
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_BINARYTRANSFER,1);
$rawdata = curl_exec($ch);
curl_close($ch);

// Using fwrite to save the above
$fp = fopen("SomeLocationInReferenceToYourScript/AnyNameYouWant.jpg", 'w');

// Write the file
fwrite($fp, $rawdata);

// And then close it.
fclose($fp);

если вы хотите избавиться от "черных полос" и сделать это так, как это делает YouTube, вы можете использовать:

https://i.ytimg.com/vi_webp/<video id>/mqdefault.webp

и если вы не можете использовать

Я сделал функцию только для извлечения существующих изображений из YouTube

function youtube_image($id) {
    $resolution = array (
        'maxresdefault',
        'sddefault',
        'mqdefault',
        'hqdefault',
        'default'
    );

    for ($x = 0; $x < sizeof($resolution); $x++) {
        $url = '//img.youtube.com/vi/' . $id . '/' . $resolution[$x] . '.jpg';
        if (get_headers($url)[0] == 'HTTP/1.0 200 OK') {
            break;
        }
    }
    return $url;
}

на API данных YouTube v3, вы можете получить миниатюры видео с помощью видео->список. (в PHP одни!--2-->.)

вы можете узнать Видео который содержит URL-адрес миниатюры видео. В ссылке есть пример кода. Или, если вы хотите проанализировать XML, есть информация здесь. Возвращаемый XML имеет media:thumbnail элемент, содержащий URL эскиза.

// Get image form video URL
$url = $video['video_url'];

$urls = parse_url($url);

//Expect the URL to be http://youtu.be/abcd, where abcd is the video ID
if ($urls['host'] == 'youtu.be') :

    $imgPath = ltrim($urls['path'],'/');

//Expect the URL to be http://www.youtube.com/embed/abcd
elseif (strpos($urls['path'],'embed') == 1) :

    $imgPath = end(explode('/',$urls['path']));

//Expect the URL to be abcd only
elseif (strpos($url,'/') === false):

    $imgPath = $url;

//Expect the URL to be http://www.youtube.com/watch?v=abcd
else :

    parse_str($urls['query']);

    $imgPath = $v;

endif;

YouTube принадлежит Google, и Google любит иметь разумное количество изображений для разных размеров экрана, поэтому его изображения хранятся в разных размерах, вот пример того, как ваш эскиз нравится ему понравится

эскиз низкого качества:

http://img.youtube.com/vi/<YouTube_Video_ID_HERE>/sddefault.jpg

эскиз среднего качества:

http://img.youtube.com/vi/<YouTube_Video_ID_HERE>/mqdefault.jpg

высокое качество миниатюра:

http://img.youtube.com/vi/<YouTube_Video_ID_HERE>/hqdefault.jpg

максимальное качество миниатюр:

http://img.youtube.com/vi/<YouTube_Video_ID_HERE>/maxresdefault.jpg

YOUTUBE API ВЕРСИИ 3 * * ВВЕРХ И РАБОТАЕТ В ТЕЧЕНИЕ 2 МИНУТ**

Если все, что вы хотите сделать, это поиск YouTube и получить связанные свойства:

1. получить публичный API -- эта ссылка дает хорошее направление

2.Используйте строку запроса ниже. Поисковый запрос (обозначается q=) в строке url есть stackoverflow для примера. Затем YouTube отправит вам ответ json, где затем вы можете проанализировать миниатюру, фрагмент, автора и т. д.

https://www.googleapis.com/youtube/v3/search?part=id%2Csnippet&maxResults=50&q=stackoverflow&key=YOUR_API_KEY_HERE

использование:

https://www.googleapis.com/youtube/v3/videoCategories?part=snippet,id&maxResults=100&regionCode=us&key=**Your YouTube ID**

выше ссылка. Используя это, вы можете найти характеристики YouTube видео. После поиска характеристик, вы можете получить видео выбранной категории. После этого вы можете найти выбранные видеоизображения с помощью ответ Асафа.

попробуйте вышеуказанный подход, и вы можете разобрать все с YouTube API.

Я использовал миниатюры YouTube таким образом:

$url = 'http://img.youtube.com/vi/' . $youtubeId . '/0.jpg';
$img = dirname(__FILE__) . '/youtubeThumbnail_'  . $youtubeId . '.jpg';
file_put_contents($img, file_get_contents($url));

помните, YouTube предотвращает включение изображений непосредственно с их сервера

Я нашел этот отличный инструмент, который позволяет создавать изображение с помощью кнопки воспроизведения YouTube, расположенной над изображением:

• установлен на сервере для сценариев:https://github.com/halgatewood/youtube-thumbnail-enhancer

чтобы добавить / расширить приведенные решения, я считаю необходимым отметить, что, поскольку у меня была эта проблема, можно фактически захватить несколько видеороликов YouTube, в этом случае миниатюры, с одним HTTP-запросом:

используя клиент Rest, в этом случае HTTPFUL, вы можете сделать что-то вроде этого:

<?php
header("Content-type", "application/json");

//download the httpfull.phar file from http://phphttpclient.com
include("httpful.phar");

$youtubeVidIds= array("nL-rk4bgJWU", "__kupr7KQos", "UCSynl4WbLQ", "joPjqEGJGqU", "PBwEBjX3D3Q");


$response = \Httpful\Request::get("https://www.googleapis.com/youtube/v3/videos?key=YourAPIKey4&part=snippet&id=".implode (",",$youtubeVidIds)."")

->send();

print ($response);

?>

простая функция php, которую я создал для миниатюры youtube, и типы

• по умолчанию
• hqdefault
• mqdefault
• sddefault

• maxresdefault

  function get_youtube_thumb($link,$type){
  
      $video_id = explode("?v=", $link); 
          if (empty($video_id[1])){
             $video_id = explode("/v/", $link); 
             $video_id = explode("&", $video_id[1]); 
             $video_id = $video_id[0];
          }
      $thumb_link = "";
      if($type == 'default' || $type == 'hqdefault' || $type == 'mqdefault' || $type == 'sddefault' || $type == 'maxresdefault'){
  
          $thumb_link = 'http://img.youtube.com/vi/'.$video_id.'/'.$type.'.jpg';
  
      }elseif($type == "id"){
          $thumb_link = $video_id;
      }
      return $thumb_link;}
  

Другой альтернативой было бы использовать oEmbed API, который поддерживается YouTube.

вы просто добавляете свой Url YouTube в url oEmbed, и вы получите JSON, включая эскиз и html-код для встраивания.

пример:

http://www.youtube.com/oembed?format=json&url=http%3A//youtube.com/watch%3Fv%3DDLzxrzFCyOs

даст вам:

{
  thumbnail_url: "https://i.ytimg.com/vi/DLzxrzFCyOs/hqdefault.jpg",
  width: 459,
  author_name: "AllKindsOfStuff",
  version: "1.0",
  author_url: "https://www.youtube.com/channel/UCLNd5EtH77IyN1frExzwPRQ",
  thumbnail_width: 480,
  type: "video",
  provider_url: "https://www.youtube.com/",
  html: "<iframe width="459" height="344" src="https://www.youtube.com/embed/DLzxrzFCyOs?feature=oembed" frameborder="0" allowfullscreen></iframe>",
  title: "Some title bla bla foo bar",
  thumbnail_height: 360,
  provider_name: "YouTube",
  height: 344
}

прочитайте документацию для больше информация.

Если вы используете открытый api, лучший способ сделать это-использовать операторы if.

Если видео является общедоступным или незарегистрированным, вы устанавливаете миниатюру с помощью метода url. Если видео является частным, вы используете api для получения миниатюры.

<?php
if($video_status == 'unlisted'){
$video_thumbnail = 'http://img.youtube.com/vi/'.$video_url.'/mqdefault.jpg';
$video_status = '<i class="fa fa-lock"></i>&nbsp;Unlisted';
}
elseif($video_status == 'public'){
$video_thumbnail = 'http://img.youtube.com/vi/'.$video_url.'/mqdefault.jpg';
$video_status = '<i class="fa fa-eye"></i>&nbsp;Public';
}
elseif($video_status == 'private'){
$video_thumbnail = $playlistItem['snippet']['thumbnails']['maxres']['url'];
$video_status = '<i class="fa fa-lock"></i>&nbsp;Private';
}

API данных YouTube

YouTube предоставляет нам 4 сгенерированных изображения для каждого видео через API данных (v3), например -

1. https://i.ytimg.com/vi/V_zwalcR8DU/maxresdefault.jpg

2. https://i.ytimg.com/vi/V_zwalcR8DU/sddefault.jpg

3. https://i.ytimg.com/vi/V_zwalcR8DU/hqdefault.jpg

4. https://i.ytimg.com/vi/V_zwalcR8DU/mqdefault.jpg

получение доступа к изображениям через API

1. сначала получите свой открытый ключ API в Google API Консоль.
2. согласно ссылке миниатюр YouTube в документация по API, вам нужно получить доступ к ресурсам на фрагменте.ноготь большого пальца.

3. в соответствии с этим, вам нужно сформулировать свой URL так -

   www.googleapis.com/youtube/v3/videos?part=snippet&id=yourVideoId & клавиша=yourApiKey

теперь измените yourVideoId и yourApiKey на соответствующий идентификатор видео и api-ключ, и его ответ будет JSON вывод предоставляя вам 4links в эскизы переменной фрагмента (если все имеются).

Я думаю, что их много ответа на миниатюру, но я хочу добавить некоторые другие URL-адреса, чтобы получить миниатюру youtube очень легко. Я просто беру текст из ответа Асаф. Вот некоторые url, чтобы получить эскизы youtube

https://ytimg.googleusercontent.com/vi/<insert-youtube-video-id-here>/default.jpg

для высококачественной версии эскиза используйте url-адрес, подобный этому:

https://ytimg.googleusercontent.com/vi/<insert-youtube-video-id-here>/hqdefault.jpg

существует также версия миниатюры среднего качества, используя url-адрес, похожий на HQ:

https://ytimg.googleusercontent.com/vi/<insert-youtube-video-id-here>/mqdefault.jpg

для стандартного определения версия эскиза, используйте url-адрес, похожий на этот:

https://ytimg.googleusercontent.com/vi/<insert-youtube-video-id-here>/sddefault.jpg

для версии эскиза с максимальным разрешением используйте url-адрес, подобный этому:

https://ytimg.googleusercontent.com/vi/<insert-youtube-video-id-here>/maxresdefault.jpg

надеюсь, что это поможет кому-то в ближайшем будущем.

вы можете получить идентификатор видео из url-адреса видео YouTube с помощью parse_url ,parse_str а затем вставьте в прогнозные URL-адреса для изображений. Благодаря YouTube для предсказательных URLs

$videoUrl = "https://www.youtube.com/watch?v=8zy7wGbQgfw";
parse_str( parse_url( $videoUrl, PHP_URL_QUERY ), $my_array_of_vars );
$ytID = $my_array_of_vars['v']; //gets video ID

print "https://img.youtube.com/vi/<?php print $ytID?>/maxresdefault.jpg";
print "https://img.youtube.com/vi/<?php print $ytID?>/mqdefault.jpg";
print "https://img.youtube.com/vi/<?php print $ytID?>/hqdefault.jpg";
print "https://img.youtube.com/vi/<?php print $ytID?>/sddefault.jpg";
print "https://img.youtube.com/vi/<?php print $ytID?>/default.jpg";

вы можете использовать этот инструмент для создания эскизов YouTube

https://codeatools.com/get-youtube-video-thumbnails

    function get_video_thumbnail( $src ) {
            $url_pieces = explode('/', $src);
            if( $url_pieces[2] == 'dai.ly'){
                $id = $url_pieces[3];
                $hash = json_decode(file_get_contents('https://api.dailymotion.com/video/'.$id.'?fields=thumbnail_large_url'), TRUE);
                $thumbnail = $hash['thumbnail_large_url'];
            }else if($url_pieces[2] == 'www.dailymotion.com'){
                $id = $url_pieces[4];
                $hash = json_decode(file_get_contents('https://api.dailymotion.com/video/'.$id.'?fields=thumbnail_large_url'), TRUE);
                $thumbnail = $hash['thumbnail_large_url'];
            }else if ( $url_pieces[2] == 'vimeo.com' ) { // If Vimeo
                $id = $url_pieces[3];
                $hash = unserialize(file_get_contents('http://vimeo.com/api/v2/video/' . $id . '.php'));
                $thumbnail = $hash[0]['thumbnail_large'];
            } elseif ( $url_pieces[2] == 'youtu.be' ) { // If Youtube
                $extract_id = explode('?', $url_pieces[3]);
                $id = $extract_id[0];
                $thumbnail = 'http://img.youtube.com/vi/' . $id . '/mqdefault.jpg';
            }else if ( $url_pieces[2] == 'player.vimeo.com' ) { // If Vimeo
                $id = $url_pieces[4];
                $hash = unserialize(file_get_contents('http://vimeo.com/api/v2/video/' . $id . '.php'));
                $thumbnail = $hash[0]['thumbnail_large'];
            } elseif ( $url_pieces[2] == 'www.youtube.com' ) { // If Youtube
                $extract_id = explode('=', $url_pieces[3]);
                $id = $extract_id[1];
                $thumbnail = 'http://img.youtube.com/vi/' . $id . '/mqdefault.jpg';
            } else{
                $thumbnail = tim_thumb_default_image('video-icon.png', null, 147, 252);
            }
            return $thumbnail;
        }

get_video_thumbnail('https://vimeo.com/154618727');
get_video_thumbnail('https://www.youtube.com/watch?v=SwU0I7_5Cmc');
get_video_thumbnail('https://youtu.be/pbzIfnekjtM');
get_video_thumbnail('http://www.dailymotion.com/video/x5thjyz');

лучшие ответы оптимизированный для ручного использования. Маркер video ID без разделителей позволяет выбрать с двойным щелчком мыши.

каждое видео YouTube имеет 4 сгенерированных изображения. Они предсказуемо отформатированы следующим образом:

https://img.youtube.com/vi/YOUTUBEVIDEOID/0.jpg
https://img.youtube.com/vi/YOUTUBEVIDEOID/1.jpg
https://img.youtube.com/vi/YOUTUBEVIDEOID/2.jpg
https://img.youtube.com/vi/YOUTUBEVIDEOID/3.jpg

первый в списке-полноразмерное изображение, а другие-уменьшенные изображения. Уменьшенное изображение по умолчанию (т. е. один из 1.jpg, 2.jpg, 3.jpg) составляет:

https://img.youtube.com/vi/YOUTUBEVIDEOID/default.jpg

для высококачественной версии эскиз используйте url-адрес, похожий на этот:

https://img.youtube.com/vi/YOUTUBEVIDEOID/hqdefault.jpg

существует также версия миниатюры среднего качества, используя url-адрес, похожий на HQ:

https://img.youtube.com/vi/YOUTUBEVIDEOID/mqdefault.jpg

для стандартной версии определения эскиза используйте url-адрес, подобный этому:

https://img.youtube.com/vi/YOUTUBEVIDEOID/sddefault.jpg

для версии эскиза с максимальным разрешением используйте url-адрес, подобный этому:

https://img.youtube.com/vi/YOUTUBEVIDEOID/maxresdefault.jpg

все вышеуказанные URL-адреса также доступны через http. Кроме того, немного более короткое имя хоста i3.ytimg.com работает вместо img.youtube.com в приведенном выше примере URL-адресов.

кроме того, вы можете использовать API данных YouTube (v3) для получения уменьшенных изображений.

Способ 1:

вы можете найти youtube видео всю информацию с JSON страницы, которая имеет даже " thumbnail_url" http://www.youtube.com/oembed?format=json&url= {Ваш url видео идет здесь}

как окончательный url look + php тестовый код

$data = file_get_contents("https://www.youtube.com/oembed?format=json&url=https://www.youtube.com/watch?v=_7s-6V_0nwA");
$json = json_decode($data);
var_dump($json); 

выход

object(stdClass)[1]
  public 'width' => int 480
  public 'version' => string '1.0' (length=3)
  public 'thumbnail_width' => int 480
  public 'title' => string 'how to reminder in window as display message' (length=44)
  public 'provider_url' => string 'https://www.youtube.com/' (length=24)
  public 'thumbnail_url' => string 'https://i.ytimg.com/vi/_7s-6V_0nwA/hqdefault.jpg' (length=48)
  public 'author_name' => string 'H2 ZONE' (length=7)
  public 'type' => string 'video' (length=5)
  public 'author_url' => string 'https://www.youtube.com/channel/UC9M35YwDs8_PCWXd3qkiNzg' (length=56)
  public 'provider_name' => string 'YouTube' (length=7)
  public 'height' => int 270
  public 'html' => string '<iframe width="480" height="270" src="https://www.youtube.com/embed/_7s-6V_0nwA?feature=oembed" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>' (length=171)
  public 'thumbnail_height' => int 360

для деталей вы также можете увидеть https://www.youtube.com/watch?v=mXde7q59BI8 видео урок 1

Способ 2: использование ссылки youtube img https://img.youtube.com/vi/ "вставить-youtube-video-id-здесь" /default.jpg

Способ 3: использование исходного кода браузера для получения миниатюр с помощью ссылки video url - перейти к исходному коду видео и поиск thumbnailurl Теперь вы можете использовать этот URL в код сорче : {img src="https://img.youtube.com/vi /" вставить-youtube-видео-id-здесь "/default.jpg"}

для деталей вы можете также увидеть http://hzonesp.com/php/get-youtube-video-thumbnail-using-id/ или https://www.youtube.com/watch?v=9f6E8MeM6PI видео урок 2

вот простая функция, которую я создал для получения миниатюр, это легко понять и использовать. $link-это ссылка youtube, скопированная точно так же , как в браузере, напримерhttps://www.youtube.com/watch?v=BQ0mxQXmLsk

    function get_youtube_thumb($link){
    $new=str_replace('https://www.youtube.com/watch?v=','', $link);
    $thumbnail='https://img.youtube.com/vi/'.$new.'/0.jpg';
    return $thumbnail;
}

используйте это - img.youtube.com/vi/YouTubeID/ImageFormat.jpg здесь форматы изображений различны, как по умолчанию, hqdefault, maxresdefault.

это мое клиентское решение, не требующее ключа API.

YouTube.parse('https://www.youtube.com/watch?v=P3DGwyl0mJQ').then(_ => console.log(_))

код:

import { parseURL, parseQueryString } from './url'
import { getImageSize } from './image'

const PICTURE_SIZE_NAMES = [
    // 1280 x 720.
    // HD aspect ratio.
    'maxresdefault',
    // 629 x 472.
    // non-HD aspect ratio.
    'sddefault',
    // For really old videos not having `maxresdefault`/`sddefault`.
    'hqdefault'
]

// - Supported YouTube URL formats:
//   - http://www.youtube.com/watch?v=My2FRPA3Gf8
//   - http://youtu.be/My2FRPA3Gf8
export default
{
    parse: async function(url)
    {
        // Get video ID.
        let id
        const location = parseURL(url)
        if (location.hostname === 'www.youtube.com') {
            if (location.search) {
                const query = parseQueryString(location.search.slice('/'.length))
                id = query.v
            }
        } else if (location.hostname === 'youtu.be') {
            id = location.pathname.slice('/'.length)
        }

        if (id) {
            return {
                source: {
                    provider: 'YouTube',
                    id
                },
                picture: await this.getPicture(id)
            }
        }
    },

    getPicture: async (id) => {
        for (const sizeName of PICTURE_SIZE_NAMES) {
            try {
                const url = getPictureSizeURL(id, sizeName)
                return {
                    type: 'image/jpeg',
                    sizes: [{
                        url,
                        ...(await getImageSize(url))
                    }]
                }
            } catch (error) {
                console.error(error)
            }
        }
        throw new Error(`No picture found for YouTube video ${id}`)
    },

    getEmbeddedVideoURL(id, options = {}) {
        return `https://www.youtube.com/embed/${id}`
    }
}

const getPictureSizeURL = (id, sizeName) => `https://img.youtube.com/vi/${id}/${sizeName}.jpg`

утилиты image.js:

// Gets image size.
// Returns a `Promise`.
function getImageSize(url)
{
    return new Promise((resolve, reject) =>
    {
        const image = new Image()
        image.onload = () => resolve({ width: image.width, height: image.height })
        image.onerror = reject
        image.src = url
    })
}

утилиты url.js:

// Only on client side.
export function parseURL(url)
{
    const link = document.createElement('a')
    link.href = url
    return link
}

export function parseQueryString(queryString)
{
    return queryString.split('&').reduce((query, part) =>
    {
        const [key, value] = part.split('=')
        query[decodeURIComponent(key)] = decodeURIComponent(value)
        return query
    },
    {})
}

public const string tubeThumb = "http://i.ytimg.com/vi/[id]/hqdefault.jpg";
vid.Thumbnail = tubeThumb.Replace("[id]", vid.VideoID);

сохранить файл как .js

  var maxVideos = 5;
  $(document).ready(function(){
  $.get(
    "https://www.googleapis.com/youtube/v3/videos",{
      part: 'snippet,contentDetails',
      id:'your_video_id',
      kind: 'youtube#videoListResponse',
      maxResults: maxVideos,
      regionCode: 'IN',
      key: 'Your_API_KEY'},
      function(data){
        var output;
        $.each(data.items, function(i, item){
          console.log(item);
                thumb = item.snippet.thumbnails.high.url;
          output = '<div id="img"><img src="' + thumb + '"></div>';
          $('#thumbnail').append(output);
        })
        
      }
    );
}); 

.main{
 width:1000px;
 margin:auto;
}
#img{
float:left;
display:inline-block;
margin:5px;
}

<!DOCTYPE html>
<html>
<head>
  <title>Thumbnails</title>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<div class="main">
 <ul id="thumbnail"> </ul>
</div>
</body>
</html>