Добрый день. Столкнулся с комплексом проблем, сопровождающих API YouTube. Прежде всего - задача в том, чтобы по клику на некий сторонний button подключить этот самый API и запустить видео. Т.е. API нельзя напрямую подключть при загрузке страницы. Все делал в соответствии с
документацией.
Делаю следующее:
$(document).on('click', "#playVideo", function() {
// Ссылка на ролик зашита в атрибут data-link кнопки
videoLink = $(this).attr("data-link").split("v=")[1] || $(this).attr("data-link").split("embed/")[1];
// Вызываем функцию, подключающую API
getYouTubeAPI(onYouTubeIframeAPIReady);
});
Вот сама функция, подключающая API:
function getYouTubeAPI(callback) {
var doc = document,
script = doc.createElement('script'),
lastScript = $("script")[$("script").length - 1];
script.src = 'https://www.youtube.com/iframe_api';
lastScript.before(script);
// В конце вызываем функцию, которая создает объект плеера и запускает видео
callback();
}
Функция, создающая объект плеера и запускающая видео:
var videoLink,
player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('videoInner', {
videoId: videoLink,
playerVars: {
'autoplay': 1
},
events: {
'onReady': onPlayerReady
}
});
}
function onPlayerReady(event) {
event.target.playVideo();
}
Суть проблемы в консоли: Uncaught ReferenceError: YT is not defined, т.е. в функции onYouTubeIframeAPIReady - YT при создании плеера не определен, что означает, что предыдущая функция не успела отработать. Точнее, функция-то отработала, но API не успел полностью загрузиться, и коллбэк его не видит (это как мне представляется). Проверяется отложенным вызовом onYouTubeIframeAPIReady, т.е. через setTimeout - нормально срабатывает. Но setTimeout не хочется использовать, что-то подсказывает, что это не самое правильное решение.
Другая беда, что даже если срабатывает (по setTimeout) - то срабатывает только на PC. А на Андроиде, к примеру - не срабатывает, т.е. не загружается и не включается никакое видео.
И завершает сей стек проблем
вот эта история в Хроме. Не знаю, возможно это как-то влияет на то, что в Андроиде не загружается, но, в любом случае, черт с ним, позже разберусь. Пока интересует, как все-таки вызвать функию onYouTubeIframeAPIReady только тогда, когда сработала предыдущая и API полностью загрузился?