"Failed to execute 'postMessage'" error from Froogaloop via AngularJS directive "Failed to execute 'postMessage'" error from Froogaloop via AngularJS directive angularjs angularjs

"Failed to execute 'postMessage'" error from Froogaloop via AngularJS directive


I recommend to execute the code in the onLoad event from <iframe>. Then you are ensured that the code will execute when iframe is ready for receiving messages.

There are plenty ways to do it:

  • You can use jQuery if you already have it in your project: $('iframe').load(callback) or
  • write an EventListener: iframe_element.addEventListener('load', callback) or
  • use plain onload callback: iframe_element.onload = callback.

Where callback is the method which uses Froogaloop.

But you have to know that some of those solutions might have some drawbacks on some old/MS browsers browsers.


For me it looks like angularjs triggers Player API before actually rendering the iframe on the page. At least if I postpone scope.$watch it works fine:

$timeout(function() {    scope.$watch('controlBoolean', function() {/* your code goes here */});});