2017-04-11 73 views
1

我們公司的客戶端使用JWPlayer來處理視頻內容。控制嵌入式JWPlayer

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

中嵌入源鏈接(編輯出於顯而易見的原因),在它的JWPlayer代碼,其中一個可以訪問:爲了讓他們融入我們的SaaS平臺,我們使用他們提供的代碼嵌入自己的內容JavaScript API來執行諸如播放,暫停等操作。我正在尋找一種方法來包含對JWPlayer API的引用,以便我可以直接實例化一個jwplayer對象(如API文檔中所演示的),或者使用一些交叉 - 像postMessage這樣的通信發送命令到嵌入式頁面。我搜索了API文檔和StackOverflow,但找不到答案。有沒有人遇到過這個?

謝謝!

回答

0

使用嵌入JW Platform託管播放器的IFRAME方法基本上限制了您從JW Player/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平臺,那麼對你潛在的更好的方法是使用嵌入您父頁面,而不是iframe嵌入的直接JS。

這個簡單的涉及到改變從名「.html」到「.js文件」中使用的URL的擴展和使用腳本標籤,而不是一個IFRAME的:

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

,這會使得玩家內嵌在你的頁面提供對JW Player & API的完全訪問。根據玩家在JW儀表板中配置的方式,您可能需要將其包裝在其他傢俱中以控制尺寸。