Javascript 控制嵌入式JWPlayer

我们公司的一位客户使用JWPlayer制作视频内容。为了将它们集成到我们的SaaS平台中，我们正在使用它们提供的代码嵌入它们的内容：

<iframe src="http://video.CLIENTWEBSITE.com/players/MEDIAID-PLAYERID.html" width="100%" height="100%" frameborder="0" scrolling="auto" allowfullscreen style=”position:absolute;”></iframe>

嵌入中的源链接（出于明显的原因进行了编辑）中有JWPlayer代码，在其中可以访问Javascript API来执行播放、暂停等操作。我正在寻找一种方法，既可以包含对JWPlayer API的引用，也可以直接实例化JWPlayer对象（如API文档中所示）或者使用诸如postMessage之类的跨源通信将命令发送到嵌入的页面。我搜索了API文档和StackOverflow，但没有找到答案。以前有人见过这个吗

---

谢谢

使用嵌入JW平台托管播放器的IFRAME方法，基本上将您从父页面与该JW播放器/API交互的选项限制为简单的“播放”和“暂停”请求

这些请求可以使用“postMessage”跨帧消息传递技术发送到iframe，但以下是当前提供的唯一“侦听器”

/** Used to pass play/pause messages parent iframe via postMessage **/
window.addEventListener("message", function(evt) {
  switch (evt.data) {
    case "play":
      jwplayer().play(true);
      break;
    case "pause":
      jwplayer().pause(true);
      break;
  }
});

假设这些资产是从JW平台链接到的，那么对您来说，一个可能更好的方法是在父页面上使用直接JS嵌入，而不是IFRAME嵌入

这很简单，包括将URL的扩展名从“.html”更改为“.js”，并使用脚本标记而不是IFRAME：

<script src="http://video.CLIENTWEBSITE.com/players/MEDIAID-PLAYERID.js"></script>

这将使播放器内联到您的页面中，提供对jwplayer&API的完全访问。根据播放器在JW仪表板中的配置方式，您可能需要将其包装在其他家具中以控制大小