iframe 跨域调用父级方法的方案
一、如果高层域名相同的话,可以通过document.domain来实现跨域访问
例如:
父级域名:localhost:8080
子级域名:localhost:9090
那么可以设置document.domain = 'localhost' 来实现跨域访问
二、如果域名没有相同之处
先来做一个假设:假如
我现在有两个系统,一个是工作流服务平台,其中一个功能就是“代办”;
另一个是OA系统,现在我要在OA系统中直接嵌入工作流服务平台的代办页面,而代办页面的中,点击处理又会打开OA系统提供的审批页面,审批页面中有个按钮“同意”;
工作流程服务平台的代办页面为 db.html,OA系统提供的审批页面为 sp.html,当在sp.html中点击“同意”按钮后,要求代办页面更新数据。
1.工作流服务平台需要的代码:(假设域名为localhost:9090)
db.html: (子页面是sp.html)
<html>
<script>
function refresh(){
document.getElementById('data').innerHTML = '2222';
}
</script>
<body>
<div id="data">111</div>
</body>
</html>
execRefresh.html: (这是实现跨域的关键)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title> exec main function </title>
</head> <body>
<script type="text/javascript">
parent.parent.refresh(); // execute main function
</script>
</body>
</html>
2.OA系统需要的代码:(假设域名为 127.0.0.1:9090)
sp.html(是db.html的子页面)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title> iframe window </title> <script type="text/javascript"> // exec main function
function exec_main(){
if(typeof(exec_obj)=='undefined'){
exec_obj = document.createElement('iframe');
exec_obj.name = 'tmp_frame';
exec_obj.src = 'http://localhost:9090/zz/execRefresh.html';
exec_obj.style.display = 'none';
document.body.appendChild(exec_obj);
}else{
exec_obj.src = 'http://localhost:9090/zz/execRefresh.html?' + Math.random();
}
}
</script> </head> <body>
<p>B.html iframe</p>
<p><input type="button" value="同意" onclick="exec_main()"></p>
</body>
</html>
注:请重点注意红色字体
iframe 跨域调用父级方法的方案的更多相关文章
- 子页面iframe跨域执行父页面定义的JS方法
问题需求:父页面与子页面iframe跨域嵌套,子页面要触发父页面所定义的js方法.父子页面的数据传递. 下文中会用到一些文件:父页面: parent.html嵌在父页面的子iframe页面:child ...
- 跨域调用接口的方法之一:$.ajaxSetup()
跨域查询接口的数据,之前在公司时有发生过,产生的原因是,本地请求的域名或IP地址不一致,解除方法,也是修改域名和IP地址.比如: 接口中的数据来自IP地址:192.168.1.23/get.php 如 ...
- Js跨域、父级窗口执行JS赋值、取值,更改元素
网站域名: A:http://www.xxoo.com/a.html B:http://www.aabb.com/b.html B网站嵌套与A网站(A的a中的Iframe指向B中的b)b要让父级a页面 ...
- layer.open打开iframe页面的调用父页面方法及关闭
//调用父类方法 window.parent.exportData($('#shownum').val(),$('#splitstr').val()); //关闭iframe页面var index = ...
- jquery Ajax跨域调用WebServices方法
由于公司需要开发一个手机页面,想提供给同事直接在手机上可以查询SAP资料.数据需要使用js调用webserver来获取. 因为初次使用Jquery调用Webserver,所以期间并不顺利.测试调用We ...
- Flutter子组件调用父组件方法修改父组件参数
子组件调用父级组件方法的主要实现是父组件给子组件传入一个方法,然后在子组件中调用父级方法来修改父级的参数.看一下效果图 父级组件实现 在父级组件中写一个_editParentText的方法来修改组件中 ...
- 谷歌、火狐浏览器下实现JS跨域iframe高度自适应的完美解决方法,跨域调用JS不再是难题!
谷歌.火狐浏览器下实现JS跨域iframe高度自适应的解决方法 导读:今天开发的时候遇到个iframe自适应高度的问题,相信大家对这个不陌生,但是一般我们都是在同一个项目使用iframe嵌套页面,这个 ...
- JS跨域(ajax跨域、iframe跨域)解决方法及原理详解(jsonp)
这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...
- IFrame跨域处理方法-Javascript
在漫长的前端开发旅途上,无可避免的会接触到ajax,而且一般情况下都是用在同一域下的ajax请求:但是如果请求是发生在不同的域下,请求就无法执行,并且会抛出异常提示不允许跨域请求,目前我没有找到明确的 ...
随机推荐
- 2018.10.25 bzo1227: [SDOI2009]虔诚的墓主人(组合数学+扫描线+bit)
传送门 有点难调啊.其实是我自己sb了 不过交上去1A1A1A还是平衡了一下心态. 所以这道题怎么做呢? 我们考虑对于一个点(x,y)(x,y)(x,y)如果这个点成为中心,正左/右/上/下分别有l/ ...
- Linux 第三天
2.文件处理命令 1)touch 创建空文件 语法:touch文件名 2)cat 显示文件内容 英文原意:concatenate 语法:cat 文件名 常用选项: -n:number,显示行号 3)t ...
- scrapy知识积累
Scrapy 中文文档https://scrapy-chs.readthedocs.io/zh_CN/latest/intro/overview.html 创建项目 scrapy startproje ...
- CentOS 7 / RHEL 7 运行单用户模式进行root的密码重置
步骤一,开机时随便按下键盘,进入以下菜单 步骤二: 选择第一项,按e键进行修改 步骤三,定位到 ro( linux 16 or linuxefi ) 步骤四:把ro改成 “rw init=/sys ...
- c#利用循环将类实例化为对象
参考:https://yq.aliyun.com/wenzhang/show_6121 上面的代码每次使用前并没有实例化,会报错,实例化以下就好了,参考:http://bbs.csdn.net/top ...
- maven下的经常使用的几个元素以及依赖范围的一些知识
maven的pom.xml配置文件里面的project根节点下的dependencies可以包含一个或者多个dependency元素,以声明一个或者多个依赖,每个依赖都可以包含的元素: groupId ...
- Kafka错误“Network is unreachable”和“larger than available brokers”
确定Kafka安装和启动正确,ZooKeeper可以查到所有的Brokers,但执行: kafka-topics.sh --create --zookeeper localhost:2181 --re ...
- HDU 2476 区间DP-刷字符问题-思维考察
区间DP-刷字符问题-思维考察 翻译了一下这个题,一看还是有点难以入手,标明了是区间DP问题,但是如何DP呢 来捋一捋思路吧 dp[i][j]肯定是从i刷到j所要的次数但是它的i和j是s1串还是s2串 ...
- Maven中项目的启动
在run选项卡中,选择Run Configurations
- cxGrid的FilterRow默认自动匹配左边%而不是右边%
/==============================================================================// 修改cxGrid的FilterRow ...