对于主域相同,子域不同,我们可以设置相同的document.domain来欺骗浏览器,达到跨子域的效果。

 
例如:我们有两个域名:www.a.com 和 img.a.com
在www.a.com下有a.html
在img.a.com下有img.json和img.html这两个文件。
 
img.json就是一些我们要获取的数据:
[
{
"name" : "img1",
"url" : "http://img.a.com/img1.jpg"
},
{
"name" : "img2",
"url" : "http://img.a.com/img2.jpg"
}
]

img.html就是我们iframe要引用的:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<script src="./jquery.js"></script>
<script type="text/javascript">
document.domain = "a.com"; var p = parent.window.$;
p("#sub").text("我是子页面添加的");
</script>
</body>
</html>
a.html就是要通过跨子域获取数据的页面:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- 通过跨域获取数据,并添加到ul中 -->
<ul id="data"></ul> <!-- 子页面通过parent.window来访问父页面 -->
<div id="sub"></div> <!-- 通过iframe引用img.a.com下的img.html -->
<iframe id="iframe" src="http://img.a.com/img.html"></iframe> <script src="./jquery.js"></script>
<script type="text/javascript">
document.domain = "a.com"; $("#iframe").bind("load", function() {
//获取子页面的jquery对象
iframe = document.getElementById("iframe").contentWindow.$; iframe.getJSON("http://img.a.com/img.json", function(data) {
var con = "";
//注意这里的$对象是www.a.com上的
$.each(data, function(i, v) {
con += "<li>" + v.name + ":" + v.url + "</li>";
});
$("#data").html(con);
});
});
</script>
</body>
</html>
a.html中我们通过contentWindow.$来获取子页面的jquery对象,然后通过getJSON获取数据,并通过www.a.com上的$对象把数据写入到ul中。
 
在子页面img.html中我们通过parent.window来访问父页面的$对象,并操作元素添加数据。

PHP下ajax跨子域的解决方案之document.domain+iframe的更多相关文章

  1. PHP下ajax跨域的解决方案之window.name

    原理核心:window对象的name属性是一个很特别的属性,当该window的location变化,然后重新加载,它的name属性可以依然保持不变. 依此原理,我们可以在页面A中用iframe加载其他 ...

  2. PHP下ajax跨域的解决方案之jsonp

    首先要说明一下json和jsonp的区别? json是一种基于文本的数据交换方式,或者叫做描述数据的一种格式. var person = { "name": "test& ...

  3. PHP下ajax跨域的解决方案之CORS

    由于安全的限制(同源策略,javascript只能访问同域名下的内容),如果需要进行跨域操作,那就免不了要进行跨域.   CORS(跨域资源共享,Cross-Origin Resource Shari ...

  4. ie8或9下ajax跨域问题

    ie8或9下ajax跨域支持,添加如下代码 <!--[if (IE 8)|(IE 9)]><script src="https://cdn.bootcss.com/jque ...

  5. java、ajax 跨域请求解决方案('Access-Control-Allow-Origin' header is present on the requested resource. Origin '请求源' is therefore not allowed access.)

      1.情景展示 ajax调取java服务器请求报错 报错信息如下: 'Access-Control-Allow-Origin' header is present on the requested ...

  6. ajax跨域的解决方案

    前言 公司要做一个活动页面,在其过程中发现所有的接口,ajax请求跨域.这里对跨域做个简单介绍以及提供几种解决办法. 由于浏览器实现的同源策略的限制,XmlHttpRequest只允许请求当前源(域名 ...

  7. 【JS】AJAX跨域-JSONP解决方案(一)

    AJAX跨域介绍 AJAX 跨域访问是用户访问A网站时所产生的对B网站的跨域访问请求均提交到A网站的指定页面 由于安全方面的原因, 客户端js使用xmlhttprequest只能用来向来源网站发送请求 ...

  8. ajax跨域问题解决方案

    今天来记录一下关于ajax跨域的一些问题.以备不时之需. 跨域 同源策略限制 同源策略阻止从一个域上加载的脚本获取或操作另一个域上的文档属性.也就是说,受到请求的 URL 的域必须与当前 Web 页面 ...

  9. iframe 跨域问题解决方案 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

随机推荐

  1. Oracle 11g trace events

    oracle的events,是我们在做自己的软件系统时可以借鉴的 Oracle 11g trace eventsORA-10001: control file crash event1ORA-1000 ...

  2. ExtJS模板与菜单的使用案例-床位卡

    ExtJS的模板的使用: 项目中场景基本就是表格模型: TPL:自己编写模板 store:数据源 UI组件: tbar,rbr,bbar实现工具栏 PageBar与StatusBar:可以针对TPL的 ...

  3. Python中属性和描述符的简单使用

    Python的描述符和属性是接触到Python核心编程中一个比较难以理解的内容,自己在学习的过程中也遇到过很多的疑惑,通过google和阅读源码,现将自己的理解和心得记录下来,也为正在为了该问题苦恼的 ...

  4. openVswitch(OVS)源代码分析之工作流程(数据包处理)

    上篇分析到数据包的收发,这篇开始着手分析数据包的处理问题.在openVswitch中数据包的处理是其核心技术,该技术分为三部分来实现:第一.根据skb数据包提取相关信息封装成key值:第二.根据提取到 ...

  5. tomcat-架构原理

    Apache Tomcat,通常称为Tomcat服务器,是一个开源的java servlet容器由Apache软件基金会(ASF)开发.Tomcat实现了几个java EE规范包括java servl ...

  6. 怎么爆加密过后的前端JS

    网站地址,保密,下面进入主题 页面元素和JS代码 无法看 用谷歌浏览器,选择器选中提交按钮,注意看界面元素源码 onclick="$('#submitForm').submit()" ...

  7. 温故而知新-mysql高级管理

    温故而知新-mysql高级管理 1 mysql的一些授权信息都保存在授权表中 授权表是6个 db,user,host,tables_priv,columns_priv,procs_priv 这6个表 ...

  8. 用多个class选择元素

    注意下面两个的区别:  $(".role-developer.role-designer").css("color","red");  $( ...

  9. Select Case 的简单实现

    FOR %%f in (1,3,5,7,) do if errorlevel == %%f goto CASE%%f        echo                    ERROR      ...

  10. ABAP-关于隐式与显式的DB Commit

    转载:https://www.cnblogs.com/liaojunbo/archive/2011/07/11/2103491.html 1.显式的DB Commit 显式的DB Commit并没有对 ...