js iframe跳转html跨域,如何使用Javascript从iframe实施跨域URL访问?

无需使用引荐来源网址,您可以实现window.postMessage跨域跨iframe / windows进行通信。

您发布到window.parent,然后parent返回URL。

这可行,但是需要异步通信。

如果需要同步,则必须围绕异步方法编写一个同步包装器。

// What browsers support the window.postMessage call now?

// IE8 does not allow postMessage across windows/tabs

// FF3+, IE8+, Chrome, Safari(5?), Opera10+

function SendMessage()

{

var win = document.getElementById("ifrmChild").contentWindow;

// http://robertnyman.com/2010/03/18/postmessage-in-html5-to-send-messages-between-windows-and-iframes/

// http://stackoverflow.com/questions/16072902/dom-exception-12-for-window-postmessage

// Specify origin. Should be a domain or a wildcard "*"

if (win == null || !window['postMessage'])

alert("oh crap");

else

win.postMessage("hello", "*");

//alert("lol");

}

function ReceiveMessage(evt) {

var message;

//if (evt.origin !== "http://robertnyman.com")

if (false) {

message = 'You ("' + evt.origin + '") are not worthy';

}

else {

message = 'I got "' + evt.data + '" from "' + evt.origin + '"';

}

var ta = document.getElementById("taRecvMessage");

if (ta == null)

alert(message);

else

document.getElementById("taRecvMessage").innerHTML = message;

//evt.source.postMessage("thanks, got it ;)", event.origin);

} // End Function ReceiveMessage

if (!window['postMessage'])

alert("oh crap");

else {

if (window.addEventListener) {

//alert("standards-compliant");

// For standards-compliant web browsers (ie9+)

window.addEventListener("message", ReceiveMessage, false);

}

else {

//alert("not standards-compliant (ie8)");

window.attachEvent("onmessage", ReceiveMessage);

}

}

Child.htm

/*

// Opera 9 supports document.postMessage()

// document is wrong

window.addEventListener("message", function (e) {

//document.getElementById("test").textContent = ;

alert(

e.domain + " said: " + e.data

);

}, false);

*/

// https://developer.mozilla.org/en-US/docs/Web/API/window.postMessage

// http://ejohn.org/blog/cross-window-messaging/

// http://benalman.com/projects/jquery-postmessage-plugin/

// http://benalman.com/code/projects/jquery-postmessage/docs/files/jquery-ba-postmessage-js.html

// .data – A string holding the message passed from the other window.

// .domain (origin?) – The domain name of the window that sent the message.

// .uri – The full URI for the window that sent the message.

// .source – A reference to the window object of the window that sent the message.

function ReceiveMessage(evt) {

var message;

//if (evt.origin !== "http://robertnyman.com")

if(false)

{

message = 'You ("' + evt.origin + '") are not worthy';

}

else

{

message = 'I got "' + evt.data + '" from "' + evt.origin + '"';

}

//alert(evt.source.location.href)

var ta = document.getElementById("taRecvMessage");

if(ta == null)

alert(message);

else

document.getElementById("taRecvMessage").innerHTML = message;

// http://javascript.info/tutorial/cross-window-messaging-with-postmessage

//evt.source.postMessage("thanks, got it", evt.origin);

evt.source.postMessage("thanks, got it", "*");

} // End Function ReceiveMessage

if (!window['postMessage'])

alert("oh crap");

else {

if (window.addEventListener) {

//alert("standards-compliant");

// For standards-compliant web browsers (ie9+)

window.addEventListener("message", ReceiveMessage, false);

}

else {

//alert("not standards-compliant (ie8)");

window.attachEvent("onmessage", ReceiveMessage);

}

}

Test

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值