網站開發使用或寫Ajax 一定會遇到一個問題 同源策略
但為什麼和怎麼繞過他呢? 今天來和大家分享
1. 同源定義
同源政策限制了程式碼和不同網域資源間的互動。
- 協議相同
- 埠號(Port)相同
- 主機位置(URL)相同
下表提供了一些例子展示那些來源和http://store.company.com/dir/page.html屬於同源：
| URL | Outcome | Reason |
|---|---|---|
http://store.company.com/dir2/other.html |
同源 | |
http://store.company.com/dir/inner/another.html |
同源 | |
https://store.company.com/secure.html |
不同源 | 協定不同 |
http://store.company.com:81/dir/etc.html |
不同源 | 埠號不同 |
http://news.company.com/dir/other.html |
不同源 | 主機位置不同 |
2. 目的：
瀏覽起同源政策的目的，是為了保證用戶信息的安全，防止惡意的網站竊取數據。
假如A網站是一間銀行，登入後一些資訊存在clinet端Cookie去瀏覽其他網站，如果沒有同源策略其他網站可以讀取Ａ網站的cookie或其他資訊，這是很不安全的信息就會洩漏。更可怕的是，Cookie往往用來保存用戶的登錄狀態，如果用戶沒有退出登錄，其他網站就可以冒充用戶，為所欲為。因為瀏覽器同時還規定，提交表單不受同源政策的限制。
3.非同源限制
如果非同源，行為受到限制。
- Cookie，LocalStorage和IndexDB無法讀取。
- 不能發送AJAX請求。
最常遇到的同源問題大部分是Ajax被封阻
同源政策規定，AJAX請求只能發給同源的網址，否則就報錯。
有三種方法迴避這個限制。
- JSONP
- WebSocket
- CORS
如果本文對您幫助很大，可街口支付斗內鼓勵石頭^^
