Allowing a parent window to call a function on its child iframe of a different domain
<p>I have an iframe in which src is different domain, and I am trying to call a method in iframe from parent window. Then it is giving below:</p>

<blockquote>
  <p>Uncaught SecurityError: Blocked a frame with origin
  "<a href="http://localhost:8080" rel="nofollow">http://localhost:8080</a>" from accessing a frame with origin
  "<a href="http://stage.xyz.com" rel="nofollow">http://stage.xyz.com</a>". Protocols, domains, and ports must
  match.</p>
</blockquote>

<p>On main window I have this:</p>

<pre><code>launchUPwidget(widgetParams);
function launchUPwidget(widgetParams){
    document.getElementById('iframe').contentWindow.invokeUPWidget(widgetParams);       
}
</code></pre>

<p>On iframe: </p>

<pre><code>window.invokeUPWidget = invokeWidget;
</code></pre>

<p>So how can I call a function in child iframe form parent window where iframe src is different domain?</p>

<p>here protocals are same but the domains are different.</p>