产生跨域的情况
同一域名,不同端口
同一域名,不同协议
域名和域名对应ip
主域相同,子域不同(www 为子域名 baidu.com为主域名)
协议和端口造成的跨域问题“前台”是无能为力的
- 当主域名相同子域名不同 document.domain设置成一样
document.domain = 'baidu.cn'
- location.hash
通过控制hash的变化来触发操作
- postMessage
第一个参数是发送的东西 为 string和对象
第二个为地址
// A
window.onload = function() {
var ifr = document.getElementById('ifr');
var targetOrigin = "http://www.google.com";
ifr.contentWindow.postMessage('hello world!', targetOrigin);
};
// B
var onmessage = function (event) {
var data = event.data;//消息
var origin = event.origin;//消息来源地址
var source = event.source;//源Window对象
if(origin=="http://www.baidu.com"){
console.log(data);//hello world!
}
};
if (typeof window.addEventListener != 'undefined') {
window.addEventListener('message', onmessage, false);
} else if (typeof window.attachEvent != 'undefined') {
//for ie
window.attachEvent('onmessage', onmessage);
}
以上都为双向通信即为嵌套iframe
接下来为单向
- jsonp
因为通过script标签引入的js是不受同源策略的限制的。所以我们可以通过script标签引入一个js或者是一个其他后缀形式(如php,jsp等)的文件,此文件返回一个js函数的调用
缺点只支持get
- CORS
Cross-Origin Resource Sharing
CORS主要是server来处理
不仅仅支持get还有post 但是需要新的浏览器
- window.name
如果在一个标签里面跳转网页的话,我们的 window.name不变
- 表单跨域
所以form表单提交没有跨域问题,提交form表单到另外一个域名,原来页面是无法获取新页面的内容,或者说form提交后不需要返回,但是ajax是需要返回的。
而ajax是想要读取响应内容,浏览器是不允许你这么做的。