Вам нужно используйте postMessage API, который обеспечивает простой способ взаимодействия между iFrame и его родителем. Вы отправите сообщение родителю, которое затем просмотрит значение и опубликует другое сообщение в iFrame.
Чтобы отправить сообщение на родительскую страницу, вы вызываете ее следующим образом.
parent.postMessage('Hello parent','http://origin-domain.com');
В другом направлении мы можем отправить сообщение в iFrame со следующим кодом.
var iframe = document.querySelector('iframe');
iframe.contentWindow.postMessage('Hello my child', 'http://remote-domain.com:8080');
Чтобы получить сообщение, создайте событие события для события сообщения.
function receiveMessage(event)
{
if (event.origin !== "http://remote-domain.com:8080")
return;
console.log(event.data);
}
if ('addEventListener' in window){
window.addEventListener('message', receiveMessage, false);
} else if ('attachEvent' in window){ //IE
window.attachEvent('onmessage', receiveMessage);
В этих примерах используется свойство origin, чтобы ограничить отправку сообщения и проверить, откуда оно было. Можно указать *
, чтобы разрешить отправку в любой домен, и в некоторых случаях вы можете принимать сообщения из любого домена. Однако, если вы это сделаете, вам необходимо рассмотреть последствия для безопасности и выполнить собственные проверки входящего сообщения, чтобы убедиться, что оно содержит ожидаемое. В этом случае iframe может разместить его высоту до '*', так как у нас может быть несколько родительских доменов. Однако рекомендуется проверять входящие сообщения от iFrame.
function isMessageFromIFrame(event,iframe){
var
origin = event.origin,
src = iframe.src;
if ((''+origin !== 'null') && (origin !== src.substr(0,origin.length))) {
throw new Error(
'Unexpect message received from: ' + origin +
' for ' + iframe.id + '. Message was: ' + event.data
);
}
return true;
}
Вы не можете, если iframe из другого домена. для других решений читайте другие ответы, представленные на SO, например. http://stackoverflow.com/questions/217776/how-to-apply-css-to-iframe – cari
Причина, по которой вы видите эту ошибку, связана с [той же политикой происхождения] (https://en.wikipedia.org/ вики/Same-origin_policy). В чрезвычайно простых словах это означает, что вам не разрешен доступ к коду, который не принадлежит вам. Существует несколько способов смягчить эту политику, но вы можете больше узнать об этом на странице Wiki, с которой я связан. – icecub