阅读目录
-
- 方法：
- 实现方法
摘要：跨域问题，无论是面试还是平时的工作中，都会遇到，本文总结处理跨域问题的几种方法以及其原理，也让自己搞懂这方面的知识，走起。
什么是跨域
在JavaScript中，有一个很重要的安全性限制，被称为“Same-Origin Policy”（同源策略）。这一策略对于JavaScript代码能够访问的页面内容做了很重要的限制，即JavaScript只能访问与包含它的文档在同一域下的内容。
JavaScript这个安全策略在进行多iframe或多窗口编程、以及Ajax编程时显得尤为重要。根据这个策略，在baidu.com下的页面中包含的JavaScript代码，不能访问在google.com域名下的页面内容；甚至不同的子域名之间的页面也不能通过JavaScript代码互相访问。对于Ajax的影响在于，通过XMLHttpRequest实现的Ajax请求，不能向不同的域提交请求，例如，在abc.example.com下的页面，不能向def.example.com提交Ajax请求，等等。
为什么浏览器要实现同源限制?我们举例说明:
比如一个黑客,他利用iframe把真正的银行登录页面嵌到他的页面上,当你使用真实的用户名和密码登录时,如果没有同源限制,他的页面就可以通过javascript读取到你的表单中输入的内容,这样用户名和密码就轻松到手了.
又比如你登录了OSC,同时浏览了恶意网站,该恶意 网站就可以构造AJAX请求频繁在OSC发广告帖.
跨域的情况分为以下几种：
特别注意两点：
1、如果是协议和端口造成的跨域问题“前台”是无能为力的
2、在跨域问题上，域仅仅是通过“URL的首部”来识别而不会去尝试判断相同的ip地址对应着两个域或两个域是否在同一个ip上。比如上面的，和。虽然域名和域名的ip对应，不过还是被认为是跨域。
“URL的首部”指window.location.protocol +window.location.host。其中，
window.location.protocol：指含有URL第一部分的字符串,如http:
window.location.host：指包含有URL中主机名:端口号部分的字符串.如//www.cenpok.net/server/
常用的几种跨域处理方法：
1、JSONP
2、CORS策略
3、document.domain+iframe的设置
4、HTML5的postMessage
5、使用window.name来进行跨域
跨域的原理解析及实现方法
1、JSONP（JSON with padding）
原理 ：
我们知道，在页面上有三种资源是可以与页面本身不同源的。它们是：js脚本，css样式文件，图片，像淘宝等大型网站，肯定会将这些静态资源放入cdn中，然后在页面上连接，如下所示，所以它们是可以链接访问到不同源的资源的。
1）
2）
3）
而jsonp就是利用了script标签的src属性是没有跨域的限制的，从而达到跨域访问的目的。因此它的最基本原理就是：动态添加一个
