在哪里将 postMessage 命令的参数传递给 youtube iframe

Posted 2023-05-09

【中文标题】在哪里将 postMessage 命令的参数传递给 youtube iframe

【英文标题】：where to pass arguments of postMessage command to youtube iframe

【发布时间】：2014-10-30 08:05:42

【问题描述】：

对不起，如果这看起来像我之前的问题的重新发布，但事实并非如此。 这是不同方法的不同问题。

我有这个 iframe：

<iframe id="video1"   src="https://youtube.com/embed/9IYRC7g2ICg?enablejsapi=1&autoplay=1&controls=0&loop=1&playlist=9IYRC7g2ICg&showinfo=0&modestbranding=0" frameborder="0" allowfullscreen></iframe>

现在可以在单击自定义按钮时手动暂停视频，这可以正常工作：

<script type="text/javascript">
    jQuery(document).ready(function($) 
        $('#button1').click(function() 
            $('#video1')[0].contentWindow.postMessage('"event":"command","func":"pauseVideo","args":""', '*');
        );
    );
</script>

pauseVideo 是此处列出的命令https://developers.google.com/youtube/iframe_api_reference。

我的问题是：不知何故，我完全无法使用需要参数的命令，例如seekTo(seconds:Number, allowSeekAhead:Boolean)。

为了在视频中跳转到 0:20，我尝试了：

$('#video1')[0].contentWindow.postMessage('"event":"command","func":"seekTo","args":"20, true"', '*');

但没有成功。 我可能把参数放在了错误的地方，因为这是我第一次使用 iframe 的 postMessage 函数，从这个意义上说我有点像新手。

有人可以帮我吗？ :)

【问题讨论】：

你试过"args":[20,true]吗？

出于好奇（这是真诚的好奇……而不是暗示您做错了什么），您为什么使用 postMessage 而不是使用 YouTube iframe API 创建对象？这种方法可能带来什么好处？

我最初是通过 postMessage 完成的，因为它对我来说似乎比加载 youtube api 并用它初始化播放器对象更容易（在我第一次尝试时它没有成功）。实际上到现在为止，现在我正在以正常方式 youtube api 方式进行操作，并且效果很好。

点击此链接肯定会有所帮助。 [***.com/questions/7443578/…[1]：***.com/questions/7443578/…

有关如何使用 YouTube iframe 执行此操作和其他操作的完整说明，请参阅此答案：***.com/a/7513356/1060487

【参考方案1】：

试试这个：

var data = event: 'command', func: 'seekTo', args: [20, true];
var message = JSON.stringify(data);

$('#video1')[0].contentWindow.postMessage(message, '*');