YouTube iFrame API：以编程方式原生播放？答案

【问题标题】：YouTube iFrame API: Programmatically play natively?YouTube iFrame API：以编程方式原生播放？
【发布时间】：2014-11-10 13:43:15
【问题描述】：

我正在尝试通过 JS 以编程方式播放 YouTube 视频（在 iFrame 内）。这是我用来以编程方式播放 YouTube 视频的代码：

iframe.postMessage('{"event":"command","func":"playVideo","args":""}', '*');

但是，在支持 YouTube 原生播放功能的设备中，iFrame 中的视频会变成黑屏，并且不会打开原生视频播放器。

如果可能，我如何使用 iFrame API 以编程方式本地播放视频？

【问题讨论】：

请提供一个 jsfiddle。我认为您不需要自己调用 postMessage，您应该使用 youtube 的 API 来创建播放器并使用 API 与之通信 - 它会在内部为您调用 postMessage。

标签： javascript iframe youtube

【解决方案1】：

我强烈建议您检查 Youtube Iframe Player API。 https://developers.google.com/youtube/iframe_api_reference#Playback_controls

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

function onPlayerReady(event) {
  event.target.setVolume(100);
  event.target.playVideo();
}

【讨论】：

【解决方案2】：

如果您想在加载时自动播放视频，请在您的 JS 中使用此属性：“autoplay:1”。更多信息在这里：https://developers.google.com/youtube/player_parameters#autoplay

如果您使用“onReady”事件，您必须检测设备是否允许自动播放，而 iOS 不允许。除非您使用脆弱的 UA 嗅探，否则这不是一件容易测试的事情。在这种情况下，使用内置方法更加可靠。

如果你只是想以编程方式播放视频，你可以使用这个方法：

target.playVideo();

但是，如果没有 iOS 上的用户交互，您同样无法做到这一点。而且它只适用于iOS8，早期版本不允许JS触发视频播放。

【讨论】：