##1. 什么是跨域（Cross-site)？
想了解跨域，必须先了解一下“同源策略(same origin policy)”。
1.1 同源策略
它限制了某个域下的文档或者js与另一个域中的资源交互的方式，它提供了一种安全机制，这种安全机制可以避免来自恶意网站的攻击。 同源策略要求浏览器允许来自某个网页上的js请求来自另一个网页的数据，当且仅当两个页面来自相同的域。
1.2 什么是域(origin)？
域是由三部分组合而成：URI Schema（协议类型），host name（域名）,port number（端口号）
举个例子：
1） http://www.domain.com 这个页面，URI Schema是http,host name是www.domain.com,port number是默认的80
2） https://www.xxx.com:8080/xxx/yyy URI Schema是https，hostname是www.xxx.com，port number是8080
由于1）和2）中的三部分都不相同，所以它们就是不同的域。 下面的图更好的解释了什么是同域：
PS:IE浏览器里可能不太一样，它不会把端口号作为判断依据。
1.3 为什么要有同源策略？
提出同源策略的目的是出于安全性考虑，它能够阻止来自恶意网站的脚本通过其他网站的DOM获取其他网站的信息。可以避免CSRF和XSS攻击。
1.4 同源策略是限制谁的？
1） 很多人可能搞不清楚这个问题，同源策略限制的是浏览器或者其他提供类似浏览器服务的软件，而且这仅仅是个规范，所以浏览器是否遵守这个规范也不一定，所以就会有上面的IE浏览器判断是否同源的时候并没有考虑端口号的问题。 2） 同源策略限制的是js，而图片，css这些是不存在同源策略限制的。
1.5 什么是跨域？
在某个网站的页面上通过js请求另外一个网站的数据，如果两个网站不满足同源策略，那么就存在跨域问题。
2. 为什么会有跨域问题？
由于在实际环境中，经常需要通过js获取一些数据，特别是ajax的流行，通过ajax加载某个网站的数据的场景就会经常遇到，而一旦有这样的需求，就可能会出现跨域的问题。
3. 如何判断我是否遇到了跨域问题？
一般来讲，如果你的请求被同源策略限制，浏览器的开发工具都会给出错误提示，在Chrome浏览器的console中，可能会有类似下面的提示：
4.如何解决跨域问题？
一般的思路是：通过一些妥协调整，绕过同源策略的限制。下面是我最近了解的一些方法。
为方便讲解，这里先举一个例子：
客户端采用H5开发，所有的数据都通过ajax请求从服务端获取。
客户端的页面都存放在静态文件服务器中，域名是http://static.demo.com
服务端提供接口供客户端调用，接口的参数和返回值都是JSON格式，服务端的域名是:http://server.demo.com。
如果不考虑跨域的问题，客户端与服务端的交互方式如下：
1.客户端post请求服务端，参数：｛"key":"value"｝
2.服务端返回结果：{"code"：1，"data":"success"}
4.1 Jsonp方式
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
