Как заполучить превью видео Youtube средствами JavaScript

👁 68 просмотров

Допустим есть задача хранить в массиве ссылку на видео и показать превьюшки этого видео, чтобы не путаться. Для этого у Ютуб есть свой хостинг превьюшек, на который закидывается превью видео, когда их добавляют на видеохостинг. Чтобы заполучить превью по коду видео можно воспользоваться нижеследующим кодом:

var videoURL = prompt('Ссылка на видео в Youtube', "");//Окно запроса ссылки
var imgURL = "";//Ссылка на превью
var imgVidGalSrc = [];//Массив для хранения
var pattern = /^((http|https|ftp):\/\/)/;

if(videoURL!==null&&trim(videoURL)!==""&&pattern.test(videoURL))
{
    if(videoURL.indexOf("?v=") > -1)//Если ссылка из строки запроса браузера
    {
        var videCode = videoURL.split("=")[1];
        imgURL = "https://img.youtube.com/vi/"+videCode+"/0.jpg"
    }else if(videoURL.indexOf("youtu.be/") > -1)//Если ссылка из раздела Поделиться
    {
        var videCode = videoURL.split("be/")[1];
        imgURL = "https://img.youtube.com/vi/"+videCode+"/0.jpg"
    }else//Если произошла ошибка в первом и во втором случаях
    {
        imgURL = "images/icon-video.png";//Какая-то общая иконка
    }
    //Добавляем в общий массив хранения
    imgVidGalSrc.push({url:videoURL,thumb:imgURL});
}else
{
    alert("Вы ввели пустую строку или некорректную ссылку!")
}
//Функция удаления лишних пробелов
function trim( str, charlist ) {
    charlist = !charlist ? ' \s\xA0' : charlist.replace(/([\[\]\(\)\.\?\/\*\{\}\+\$\^\:])/g, '\$1');
    var re = new RegExp('^[' + charlist + ']+|[' + charlist + ']+$', 'g');
    return str.replace(re, '');
}