11

これが私のコードですhttp://my-localhost.com/iframe-test.html

<html>
<head><title>Welcome Iframe Test</title></head>
<body>
<iframe src="http://www.my-website.com/index.html" width="500" height="500"></iframe>
<script type="text/javascript">
function alertMyMessage(msg){
    alert(msg);
}
</script>
</body>
</html>

ここにコードがありますhttp://www.my-website.com/index.html

<html>
<head></title>Welcome to my Server</title></head>
<body>
<h1>Welcome to My Server</ht>
<a href="javascript:void(0)" title="Click here" onClick="parent.alertMyMessage('Thanks for Helping me')">Click Here</a>
</body>
</html>

「ここをクリック」リンクをクリックすると。次のエラーが発生しました。

Uncaught SecurityError: 発信元が " http://www.my-website.com " のフレームが、発信元が " http://my-localhost.com "のフレームにアクセスするのをブロックしました。プロトコル、ドメイン、およびポートが一致する必要があります。

この問題を解決するために私を助けてください。または、これに対する他の解決策を教えてください。

4

2 に答える 2

19

別のオリジンのフレームにロードされたページの DOM にアクセスすることはできません。これはセキュリティ上の理由からブロックされています (アクセスしたランダムな Web サイトが非表示の iframe で Web メール サービスを開いていると想像してみてください。理由がわかります)。

最も近い方法は、両方の Web サイトを制御している場合にのみ、Web メッセージング APIを使用してそれらの間でメッセージをやり取りすることです。

1 つのページで、メッセージを処理する関数を記述し、それをメッセージ イベント リスナーとして追加します。

function receiveMessage(event)
{
  alert(event.data);
}

addEventListener("message", receiveMessage, false);

もう 1 つの場合は、次のメッセージを送信します。

parent.postMessage("This is a message", "*");

詳細については、MDN を参照してください

于 2013-10-16T15:11:36.453 に答える