无法在移动设备上自动播放YouTube

问题描述 投票:0回答:1

因此,由于此更新,我无法自动播放YouTube视频,这会阻止未静音的视频在手机上播放:https://developers.google.com/web/updates/2017/09/autoplay-policy-changes

我已经尝试在视频URL中设置mute=1volume=0。静音参数确实可以使台式机上的视频成功静音,但是我仍然无法使该视频在移动设备上自动播放。我需要自动播放的原因是因为我在初始页面加载时加载了视频图像。用户点击视频后,我的JavaScript就会加载iframe。这极大地提高了我页面的性能。关于堆栈溢出还有其他几个相关问题,但没有一个答案起作用。

这是我当前的代码:

<iframe width="560" height="315" src="https://www.youtube.com/embed/QHfgMrpMOm4?autoplay=1&mute=1" volume="0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
javascript html youtube youtube-api
1个回答
0
投票

有同样的问题,看起来有些改变。对我有用的唯一解决方案是-使用youtube API

var tag = document.createElement('script');

tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;

function onYouTubeIframeAPIReady() {
  player = new YT.Player('player', {
    height: '390',
    width: '640',
    videoId: 'M7lc1UVf-VE',
    mute: 1,
    events: {
      'onReady': onPlayerReady,
    }
  });
}

function onPlayerReady(event) {
  event.target.mute();
  event.target.playVideo();
}
<!DOCTYPE html>
<html>

<body>
  <div id="player"></div>
</body>

</html>
© www.soinside.com 2019 - 2024. All rights reserved.