跨域

一、什么是同源策略

 

Same Origin Policy同源策略，是一种约定，更是一种约束，约束着浏览器的行为。同源策略是由NetScape网景公司首先提出的一种安全策略，所有支持Javascript的浏览器都必须遵守这一约定，即执行脚本只能访问与之同源的资源。通俗而言，执行在源（或者说域）ServerA上的脚本只能访问操作在ServerA上执行的DOM树和脚本（注意：是要在源ServerA上执行，并不是存储在ServerA上，这个会在JSONP时说到）；当ServerA上的脚本试图访问操作在源（域）ServerB上的DOM时，将被拒绝。

 

二、如何同源

 

任何一个浏览器请求，只有同时满足一下三个条件是才是同源：

•      协议     （分别采用http和https的请求被视为非同源）
•      端口
•      主机     （域名、子域名、IP）

 

下表是几种情况的分析：

URI	是否同源	说明
http://ServerA.Suzhou.com/AppA/index.htm https://ServerA.Suzhou.com/AppB/index.htm	否	协议不一致
http:8181//ServerA.Suzhou.com/AppA/index.htm http:8282//ServerA.Suzhou.com/AppB/index.htm	否	端口不一致
http:8181//ServerA.Suzhou.com/AppA/index.htm http:8181//ServerA.UK.com/AppB/index.htm	否	域名不一致
http//ServerA.Suzhou.com/AppA/index.htm http//ServerB.Suzhou.com/AppB/index.htm	否	主机名不一致
http//ServerA.Suzhou.com/AppA/index.htm http//192.168.100.101/AppB/index.htm	否	虽然主机名与IP对应，但是还是非同源。 （判断报文头时无法判断是否对应）
http//ServerA.Suzhou.com/AppA/index.htm http//ServerA.Suzhou.com/AppB/index.htm	是	三个条件都符合

 

三、为什么要跨域

 

在项目实施过程中，多少会将不同的服务分布于不同的服务器上，降低服务器负载也好，更好地实现资源共享也好，总之这时就需要跨域获取资源。对于Web而言，跨域资源的请求多数是迎合Ajax要求实现无刷新更新。

 

四、常用跨域技术 

• JSONP
• Server-Proxy
• CORS

下篇将会对这几种技术详细介绍