YouTube Iframe API - Play Video auf Handy

Nach dem Suchen und finden viele ähnliche Fragen, kann ich nicht die richtige Antwort finden. Also arbeite ich mit der Iframe-API von YouTube und ich weiß, dass Autoplay usw. für Handys nicht funktionieren wird. Und ich habe ein Element erstellt, das auf Handys anzeigt, also wenn der Benutzer diesen Knopf anklickt, sollte es das Video spielen. Aber ich bekomme nur diese Nachricht: "Versuchen Sie, Ihr Gerät neu zu starten, wenn die Wiedergabe nicht bald beginnt".YouTube Iframe API - Play Video auf Handy

var playElement = document.createElement("div"); 
playElement.style.display = "none"; 

if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { 
    playElement.style.display = "block"; 
} 

var player; 
function onYouTubeIframeAPIReady() { 
    player = new YT.Player(child, { 
     width: '100%', 
     height: '100%', 
     videoId: youtubeID, 
     playerVars: { 
     'iv_load_policy': 3, 
     'enablejsapi': 1, 
     'disablekb': 1, 
     'autoplay': 1, 
     'loop': 0, 
     'controls': 0, 
     'showinfo': 0, 
     'rel': 0, 
     'mode': 'transparent' 
     }, 
     events: { 
     'onReady': onPlayerReady, 
     'onStateChange': onPlayerStateChange 
     } 
    }); 
} 

playElement.onclick = function() { 
    player.playVideo();; 
};

Wer hat eigentlich eine funktionierende Lösung?

Quelle

2017-05-26 Marius Djerv

Erinnern Spieler bezieht sich auf ein Div mit der ID "Spieler". Sie können mit dem Beispielcode youtube api doc beginnen. Es wird automatisch abgespielt, wenn das Video geladen wurde. Sie können auch Ihre playerVar Optionen hinzufügen.

Ein Hinweis für automatische Autoplay-Video. Du kannst es automatisch abspielen lassen, aber es muss stummgeschaltet werden. Sie können also versuchen, player.mute() hinzuzufügen, wenn Sie es laden und einen Click-Handler einrichten, um die Stummschaltung wieder aufzuheben, wenn Sie das bevorzugen.

<!DOCTYPE html> 
 
<html> 
 
    <body> 
 
    <!-- 1. The <iframe> (and video player) will replace this <div> tag. --> 
 
    <div id="player"></div> 
 

 
    <script> 
 
     // 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', 
 
      videoId: 'M7lc1UVf-VE', 
 
      events: { 
 
      'onReady': onPlayerReady, 
 
      'onStateChange': onPlayerStateChange 
 
      }, 
 
      playerVars 
 
     }); 
 
     } 
 

 
     // 4. The API will call this function when the video player is ready. 
 
     function onPlayerReady(event) { 
 
     event.target.playVideo(); 
 
     } 
 

 
     // 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 == YT.PlayerState.PLAYING && !done) { 
 
      setTimeout(stopVideo, 6000); 
 
      done = true; 
 
     } 
 
     } 
 
     function stopVideo() { 
 
     player.stopVideo(); 
 
     } 
 
    </script> 
 
    </body> 
 
</html>

Quelle

2017-05-26 09:36:23 Jason

YouTube Iframe API - Play Video auf Handy

Antwort

Verwandte Themen