Ho creato un piccolo script di streaming di YouTube che riproduce in modo casuale video musicali di YouTube o da una coda. Ha funzionato bene per mesi fino a questa settimana in cui non sembra voler caricare i video quando si utilizza un iPad/iPhone. Ottengo il seguente errore invece:Come risolvere "Se la riproduzione non inizia tra poco, prova a riavviare il dispositivo" usando l'API iFrame di YouTube su iPad?
Se la riproduzione non inizia poco, prova a riavviare il dispositivo
Quello che ho provato:
Ho provato Safari, Chrome , Firefox e Opera e tutti loro errore. Ho provato a cancellare i dati del sito/cache, riavviare il dispositivo, facendo il pieno riavvio del dispositivo. Niente funziona. La cosa strana è che funziona perfettamente su un desktop Windows che mi porta a credere che non sia un errore nel codice, ma qualcosa che è cambiato con l'API o con Safari. Il mio codice non è stato modificato di recente o potrebbe aver causato il suo arresto.
Ho provato a debuggarlo utilizzando jsconsole.com, non compare nulla di sospetto. In alcuni casi, verrà caricato il player, verrà visualizzato il titolo del video e così sarà l'immagine, ma dopo circa 30 secondi, l'errore sopra riportato verrà visualizzato insieme allo spinner di caricamento.
Sono consapevole del fatto che playVideo(); non funziona (riproduzione automatica) su dispositivi iOS. Questo va bene, e ancora una volta, la sceneggiatura ha funzionato in precedenza, ho solo dovuto premere play sul video primo. Ma ora, sembra che iOS stia cercando di riprodurre automaticamente il video. Così, ho anche provato rimuovendo le chiamate playVideo(), il problema persiste ancora.
Testato su iPad 2, iPad mini e iPhone 4 (tutti con l'ultimo iOS disponibile sul dispositivo e tutti funzionanti in precedenza).
Sono in perdita e sto cercando di farlo riparare prima del fine settimana per una festa in casa :) Quindi apprezzerei qualsiasi aiuto o suggerimento su cosa potrebbe causare l'errore su iOS.
ecco il codice javascript:
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
check_queue_timer = setTimeout(check_queue(),3000);
}
// 5. The API calls this function when the player's state changes.
// The function indicates that when playing a video (state=1),
// the player should play for six seconds and then stop.
var done = false;
function onPlayerStateChange(event) {
if (event.data === 0) {
// TRACK AS DONE, REFRESH QUEUE AND GET NEXT SONG
// POST TO WRITE TO FILE
$.ajax({
type: 'POST',
url: site_url+'ajax_next_track',
dataType: 'json',
data: 'queue_id='+$('#queue_id').val(),
cache: false,
success:
function(data){
if(data.status == 'success'){
$("#queue_table").empty();
if(data.queue.length == 0){
check_queue_timer = setTimeout(check_queue(),3000);
}
$.each(data.queue, function(i, item) {
if(i == 0){
event.target.loadVideoById(item.video_id);
event.target.playVideo();
$('#queue_id').val(item.queue_id);
}
$('#queue_table').append('<tr><td>'+item.title+'</td></tr>');
});
}
else{
console(data.message);
}
},
error:
function(jqXHR, textStatus, errorThrown){
$('#error_msg').html('Something broke.').fadeIn();
}
});
}
}
function stopVideo() {
player.stopVideo();
}
function check_queue(){
$.ajax({
type: 'POST',
url: site_url+'ajax_next_track',
dataType: 'json',
data: 'no_delete=1',
cache: false,
success:
function(data){
if(data.status == 'success'){
$("#queue_table").empty();
if(data.queue.length == 0){
clearTimeout(check_queue_timer);
check_queue_timer = setTimeout(check_queue(),3000);
}
$.each(data.queue, function(i, item) {
if(i == 0){
player.loadVideoById(item.video_id);
player.playVideo();
$('#queue_id').val(item.queue_id);
clearTimeout(check_queue_timer);
}
$('#queue_table').append('<tr><td>'+item.title+'</td></tr>');
});
}
else{
console(data.message);
}
},
error:
function(jqXHR, textStatus, errorThrown){
$('#error_msg').html('Something broke.').fadeIn();
}
});
}
UPDATE 1 (25 novembre 2015)
ho deciso di ripartire da zero e lavorare con il codice di esempio su https://developers.google.com/youtube/iframe_api_reference. Sembra che loadVideoById() non funzioni più su iPad. Era prima. Se non includo loadVideoById() o playVideo() funziona. Idealmente, mi piacerebbe che funzionasse con loadVideoById().
Mi è successo oggi, tutti i video non funzionano su tutti i browser youtube e fb. – XBasic3000