跨域情况下iframe页面与父页面的交互

跨域交互技巧
最新推荐文章于 2020-07-07 15:56:05 发布
最新推荐文章于 2020-07-07 15:56:05 发布 · 334 阅读 · 0

本文介绍了一种在不同根域间进行交互的方法。当A页面嵌入了来自另一个根域的B页面时，直接交互通常会受到限制。为解决此问题，可以在B页面中嵌入与A同域的C页面，通过C作为中介实现A与B间的通信。

A页面中嵌了一个B，A与B属于两个独立的根域

这时在B中想与A进行交互，一般情况下会因为没有权限而无法做到

一种解决方法：在B中再嵌一个与A同域的C，B借助与C与A进行交互

That's all. :)


iteye_15898
关注
iframe和父级页面做跨域交互案例！
web前端进阶 黑客的博客
08-22 6995
父级页面地址：http://localhost:63342/parent.html 代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </h
iframe 跨域 js交互
fyqcdbdx的专栏
11-18 1002
主要利用document.domain， 在有iframe的页面head写上：    document.domain='xxx.com' 在iframe目标页面也写上：    document.domain='xxx.com' 这样，两个页面的js就可以交互了，但要注意一个问题，在IE678下，有时获取location.href时有异常，保险起见使用loc
跨域IFRAME 安全的数据交互方案
路过君的博客
04-01 406
场景概述：站点A页面通过IFRAME嵌套站点B页面，A页面需要从B页面获取数据 站点B页面推送数据： parent.window.postMessage(data, "http://sitea"); 站点A页面接受数据： window.addEventListener("message", function (event) { if (event.origin === "http://site...
iframe跨域获取的父页面URL
xiawenyi1234的博客
07-07 7272
当iframe与父页面不属于同一个域名时，像上面的获取会因为安全策略原因而失败。在nczonline的一篇文章上看到一种方法，使用document.referrer。 方法很简单，通过parent !=window检测iframe与父页面是否同源，当不同源时，使用document.referrer，否则使用parent.location.href或者top.location.href； var getParentUrl = function() { var url = null; if (
通用版解决跨域问题，父页面获取iframe里面的内容
热门推荐
劲枫的博客
04-24 6万+
  父页面获取iframe里面内容的解决方案如下：   实验如下：开两个服务器，一个端口9000，一个端口9001 现在在9000页面要放一个iframe指向9001的一个页面，再在9000父页面打印9001iframe里面的东西是访问不了的，提示跨域了，端口不一样      现在的目标：父页面127.0.0.1:9000访问自己iframe src=127.0.0.1:9001...
iframe子页面获取父页面元素的方法
12-09
在网页开发中，有时我们需要在`iframe`子页面与父页面之间进行交互，例如获取或操作对方的DOM元素。这通常涉及到跨文档通信，因为`iframe`子页面被视为一个独立的文档，它有自己的窗口对象和文档对象模型（DOM）。...
iframe跨域调用父窗口js.zip
06-12
这种情况下，由于浏览器的同源策略限制，默认情况下，iframe内容与父页面无法直接交互。但是，通过特定的技术手段，我们可以实现iframe跨域调用父窗口的JavaScript方法。本教程将详细讲解这一过程。 首先，我们需要...
JS实现iframe中子父页面跨域通讯的方法分析
10-15
在JavaScript中，iframe子页面与父页面之间的跨域通信是一个常见的需求，特别是在处理嵌套页面交互、第三方组件或服务集成时。由于同源策略的限制，不同源的页面默认不能直接访问对方的DOM元素或JavaScript变量。...
嵌入式iframe子页面与父页面js通信的方法
10-24
一种常见的解决方案是使用一个代理iframe，该代理iframe位于父页面的同一个域下，作为子页面与父页面之间的桥梁。子页面通过改变代理iframe的`src`属性，传递数据到代理页面，然后代理页面通过`window.postMessage`...
demo_DEMO_子页面刷新父页面iframe_
09-30
在父子页面关系中，IFrame中的页面（子页面）与包含它的页面（父页面）可以进行一定程度的交互。 描述“子页面刷新父页面”指出我们要解决的是从子页面出发，如何刷新包含它的父页面。这通常通过JavaScript来实现，...
跨域下获取iframe的父页面URL
brittany2009的博客
07-13 1719
通常情况下，我们获取iframe父页面的url很简单：parent.location或top.location即可，但前提是它们遵循同源策略。当iframe与父页面不属于同一个域名时，像上面的获取会因为安全策略原因而失败。在nczonline的一篇文章上看到一种方法，使用document.referrer。   方法很简单，通过parent !=window检测iframe与父页面是否同源...
JavaScript：iframe子页面和父页面域内及跨域通信示例
快去创造奇迹
09-10 4072
iframe子页面与父页面通信
关于在iframe中，跨域调用parent页面的方法的问题
Lucius_Deng的博客
06-20 1万+
js报错信息：Uncaught SecurityError: Blocked a frame with origin "http://127.0.0.1:8080" from accessing a frame with origin "http://localhost:8888". Protocols, domains, and ports must match. 不支持跨域调用javas
关于JS跨域刷新父页面的问题
THe5THelement的专栏
11-30 1万+
最近需要实现一个小功能,父页面弹出窗口里加载不同域的子页面,操作结束之后关闭弹出窗口并刷新父页面,首先想到的实现方式:window.parent.opener.loaction.reload();window.parent.close(); 经测试发现window.parent.opener.location取不到对象,无法执行reload()修改为:try{
iframe 跨域 (子页面如果获取父页面元素)
Lance5678的专栏
12-11 5893
试验场景：           a.html   在域  www.a.com下        b.html    在域  www.b.com 下       a中通过iframe 引用  b.html  期望结果：        在b.html相关处理完成后  修改   a.html中的元素    应用场景：        公司内部有两个系统，一个电商系统，一个第三方支付系统，
Iframe跨域获取父页面URL参数
imtns59521的专栏
12-04 8330
a.html?name="abc" 　 　　<Iframe name="tt" src="http://192.168.1.131:8082/b.html" width="760" height="760" scrolling="no" frameborder="0"> 　 b.html function getJsUrl(){ var pos,
如何实现iframe跨域调用父窗口JavaScript
通常情况下，由于浏览器安全策略的限制，处于不同域下的iframe是无法直接访问或操作父页面中JavaScript的。但有些情况下，如在单点登录、广告投放、第三方内容嵌入等场景中，需要实现跨域调用。这就需要特殊的技术...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值