16

froogaloop ライブラリを使用して、再生/一時停止機能が組み込まれた vimeo ビデオ用の AngularJS ディレクティブを作成しました。

それは素晴らしい作品です！唯一の問題は、ページが最初に読み込まれたときに次のエラーが発生することです。

'DOMWindow' で 'postMessage' を実行できませんでした: 提供されたターゲットのオリジン (' http://player.vimeo.com ') が受信者ウィンドウのオリジンと一致しません

ディレクティブで froogaloop オブジェクトを間違って初期化していますか? どんな提案でも大歓迎です。

ここでプランカーをチェックできます: http://plnkr.co/edit/GKWNk3LhX0MR3lhpfqyA

4

2 に答える 2

6

onLoadからのイベントでコードを実行することをお勧めし<iframe>ます。これにより、iframe がメッセージを受信する準備ができたときにコードが実行されることが保証されます。

それを行うにはたくさんの方法があります：

  • プロジェクトにすでに jQuery がある場合は、jQuery を使用できます$('iframe').load(callback)。
  • EventListener を書く:iframe_element.addEventListener('load', callback) または
  • プレーンな onload コールバックを使用します: iframe_element.onload = callback.

callbackFroogaloop を使用する方法はどこにありますか。

ただし、これらのソリューションの一部には、一部の古い/MS ブラウザー ブラウザーでいくつかの欠点がある可能性があることを知っておく必要があります。

于 2014-05-13T16:24:51.683 に答える
2

私にとっては、実際にページに iframe をレンダリングする前に、angularjs が Player API をトリガーするように見えます。少なくとも scope.$watch を延期すると、正常に動作します。

$timeout(function() {
    scope.$watch('controlBoolean', function() {/* your code goes here */});
});
于 2014-02-25T12:23:10.207 に答える