(一)主域相同子域不同之document.domain跨域
一、什么是主域名，什么是子域名？
主域名又称一级域名或者顶级域名，由域名主体.域名后缀组成，比如cnblogs.com ；
子域名有二级域名，比如www.cnblogs.com。三级域名，比如home.m.cnblogs.com。
二、基本原理
主域相同，子域不同，可以设置document.domain来解决跨域。
1、在http://www.example.com/a.html和http://sub.example.com/b.html两个文件中都加上document.domain = "example.com"；
2、通过a.html文件创建一个iframe，去控制iframe的window，从而进行交互。
三、测试步骤
1、先安装nginx
2、创建a.html文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>主域相同子域不同a.html</title>
</head>
<body>
<script>
document.domain = 'example.com';
let ifr = document.createElement('iframe');
ifr.src = 'http://sub.example.com/b.html';
ifr.style.display = 'none';
document.body.append(ifr);
ifr.onload = function() {
let win = ifr.contentWindow;
alert(win.data);
}
</script>
</body>
</html>
3、创建b.html文件
<script> document.domain = 'example.com'; window.data = '传送的数据：1111'; </script>
4、打开http服务器，通过nginx做域名映射。将example.com映射到localhost:8080，sub.example.com映射到localhost:8081上。
5、打开操作系统下的hosts文件，并添加
127.0.0.1 www.example.com 127.0.0.1 sub.example.com
这样在浏览器打开这两个网址后就会访问本地的服务器。之后打开nginx的配置文件：/usr/local/etc/nginx/nginx.conf，并在http模块里添加：
server{
listen 80;
server_name www.example.com;
location / {
proxy_pass http://127.0.0.1:8080/;
}
}
server{
listen 80;
server_name sub.example.com;
location / {
proxy_pass http://127.0.0.1:8081/;
}
}
6、最后打开浏览器访问http://www.example.com/a.html就可以看到结果。
(一)主域相同子域不同之document.domain跨域的更多相关文章
- document.domain跨域
原文:[转载]document.domain跨域 document.domain 用来得到当前网页的域名. 比如在地址栏里输入: javascript:alert(document.domain); ...
- document.domain 跨域问题[转]
document.domain用来得到当前网页的域名.比如打开百度,在地址栏里输入: javascript:alert(document.domain); //www.baidu.com 弹出窗体: ...
- document.domain 跨域问题
document.domain用来得到当前网页的域名. 比如在地址栏里输入:javascript:alert(document.domain); //www.315ta.com我们也可以给docume ...
- Cross-origin resource sharing JSON with Padding 同源策略 JSONP 为什么form表单提交没有跨域问题，但ajax提交有跨域问题？ XMLHttpRequest and the Fetch API follow the same-origin policy 预检请求（preflight request）
https://zh.wikipedia.org/wiki/跨来源资源共享 跨来源资源共享(CORS)是一份浏览器技术的规范,提供了 Web 服务从不同域传来沙盒脚本的方法,以避开浏览器的同源策略[1 ...
- document.domain跨子域
document.domain 用来得到当前网页的域名.比如在地址栏里输入: javascript:alert(document.domain); //www.315ta.com 我们也可以给docu ...
- js 跨域的问题 （同一个主域名不同的二级域名下的跨域问题） 解决 WdatePicker.js my97日期选择控件
例如域名是 a.xx.com 和 b.xx.com 如果一个页面中引入多个iframe,要想能够操作所有iframe,必须都得设置相同domain. 如果iframe的时候 a包含b 为 ...
- JavaScript跨域总结与解决办法 什么是跨域
什么是跨域 1.document.domain+iframe的设置 2.动态创建script 3.利用iframe和location.hash 4.window.name实现的跨域数据传输 5.使用H ...
- iframe 跨域问题解决方案 利用window.name+iframe跨域获取数据详解
详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...
- jsonp跨域请求，动态script标签实现跨域
1.什么是跨域 首先一个域名地址的组成是: http://www.xxx.com:8080/xxx/xxx.jsp 协议子域名主域名端口号请求资源地址 当协议.子域名.主域名.端口号中任意一个不相同时 ...
随机推荐
- yii2 redirect重定向
redirect使用方法 $this->redirect(array('/site/contact','id'=>12)); //http://www.kuitao8.com/testwe ...
- 内网ntp时间同步配置
选择局域网中的一台机器作为ntp服务器,在ntp server上安装并启动ntpd客户端上要关闭ntpd,安装ntpdateCentOS7上这两个软件都是自带的,只需根据需要打开或者关闭.注意客户端机 ...
- P2518 [HAOI2010]计数
题目链接 \(Click\) \(Here\) 很好很妙的一个题目. 其实可以生成的数字,一定是原数的一个排列,因为\(0\)被放在前面就可以认为不存在了嘛~.也就是说现在求的就是全排列中所有小于该数 ...
- 批量ping 检测linux主机是否可以通
批量ping 检测linux主机是否可以通 # 1.配置列表 [root@db137 liweiwie]# cat /home/dbatlbb/script/liweiwie/ping_ip.txt ...
- Pandas系列（六）-时间序列详解
内容目录 1. 基础概述 2. 转换时间戳 3. 生成时间戳范围 4. DatetimeIndex 5. DateOffset对象 6. 与时间序列相关的方法 6.1 移动 6.2 频率转换 6.3 ...
- [物理学与PDEs]第5章习题3 第二 Piola 应力张量的对称性
试证明: 在物质描述下, 动量矩守恒定律等价于第二 Piola 应力张量的对称性. 证明: 由 $$\beex \bea \int_{G_t}\rho\sex{{\bf y}\times\cfrac{ ...
- [物理学与PDEs]第1章习题8 磁场分布 $\ra$ 电流分布
设在真空中有一圆柱形磁场 $$\bex B(P)=\sedd{\ba{ll} \cfrac{2I}{Cr},&r\geq R,\\ \cfrac{2I}{CR^2}r,&r<R, ...
- sublime text3格式化html,css,js代码
需要安装HTML/CSS/JS prettify插件. 安装步骤:首选项 -> Package Control -> Install Package -> HTML-CSS-JS P ...
- win10安装VMware v14.1.1.28517
一.下载 VMware v14.1.1.28517 下载地址(包含安装说明):http://www.downza.cn/soft/74728.html 二.VMware Workstation 14 ...
- Python3：关于列表的操作（合并、拼接，嵌套排序··）
一:# 将2个列表合并成字典,按最少个数key=['winnie','anna','lisa']value=[18,20,22] k_v=dict(zip(key,value))print(k_v) ...