JavaScript cookie 跨域

cookie雖然存在安全性和儲存量小等諸多缺點，被很多人詬病。

但是在其能力範圍之內，可以很方便的完成一些工作，比如儲存使用者的狀態，實現單點登入等。

不同域之間的cookie是無法訪問的，否則網際網路豈不是亂套了。

比如螞蟻部落與百度之間的cookie是無法訪問的，這非常好理解。

那是不是如下兩個網址之間的cookie是可以互相訪問:

（1）.www.softwhy.com。

（2）.zy.softwhy.com。

事實是，上述兩個站點無法實現cookie相互訪問，這是因為跨域了，預設只有同源才可以相互訪問。

然而很多需求是需要cookie可以跨域訪問，比如單點登入功能，一個子站登入，其他子站同步具有登入狀態。

下面將介紹一下如何利用JavaScript實現cookie跨域訪問。

特別說明：只有根域名相同的不同源的cookie才有可能實現跨域訪問，當前根域名不同不能實現跨域。

一.同源：

兩個站點同源，必須要滿足如下幾個條件：

（1）.首先，協議要相同。

（2）.其次，域名要相同。

（3）.最後，埠號也要相同。

具體同域具體規則可以參閱同源策略詳解一章節。

cookie同源，不要求協議也必須相同，也就是http://www.softwhy.com與https://www.softwhy.com是同源。

二.cookie跨域：

預設情況下，當前域下的cookie只能被當前域下的頁面訪問。

通過JavaScript設定cookie的doamin屬性為一個恰當值即可實現跨域效果。

語法結構如下：

[JavaScript] 純文字檢視 複製程式碼
document.cookie="name=value;path=path;domain=domain"

domain屬性值規定cookie跨域的範圍，cookie可以被domain屬性設定的域和其後代域訪問。

將domain屬性值設定為"softwhy.com"可以實現cookie被softwhy.com和其子域訪問。

程式碼例項如下：

[JavaScript] 純文字檢視 複製程式碼
document.cookie="web=螞蟻部落;path=/;domain=softwhy.com"

上述程式碼可以實現跨域，此時，path屬性值通常為根目錄。

document.domain屬性可以獲取當前頁面的域名，也可以設定cookie的cookie屬性。

程式碼例項如下：

[JavaScript] 純文字檢視 複製程式碼
document.domain

程式碼執行效果截圖如下：

在螞蟻部落首頁，谷歌開發者工具控制檯列印出當前域名。

當使用此屬性設定cookie的domain屬性時，可能的屬性值如下：

（1）.當前域名。

（2）.當前域名的父級域名。

如果當前頁面所在的域名是a.b.www.softwhy.com，那麼可能的屬性值如下：

[JavaScript] 純文字檢視 複製程式碼
document.domain = "a.b.www.softwhy.com"
document.domain = "b.www.softwhy.com"
document.domain = "www.softwhy.com"
document.domain = "softwhy.com"

實現了跨域，就一定可以互相訪問cookie嗎，不一定，還會受到path路徑的限制。

不過，只要在設定跨域的時候，一併將path屬性值設定為根目錄即可，這可以消除路徑的限制，前面提到過。

關於跨域和路徑的更多內容參閱cookie path路徑與domain域一章節。