CORS 代表跨來源資源共用(Cross-Origin Resource Sharing)。它是一種瀏覽器的機制,用於限制網頁應用程式在不同來源(主機host、協定protocol、端口port)之間的資源共用。這是出於安全考量,以確保一個網頁應用程式只能請求和存取它自己的來源資源,而不容易被其他不受信任的網站濫用。
講到CORS就不得不提到同源政策
同源政策(Same-Origin Policy)
同源政策是一個瀏覽器安全機制,用於限制在網頁中的JavaScript程式碼如何與來自不同來源的資源進行交互。來源(origin)通常由協定(protocol)、主機(host)、和端口(port)組成,只有當兩個網頁的來源完全相同時,它們就被認為是同源的,否則就是跨源的。
協定(protocol):這指的是URL中的協定部分,通常是"http"或"https"。同一個來源的資源的協定必須完全一致,否則就被視為不同的來源。
主機(host):這是URL中的主機名稱或IP地址部分。同一個來源的資源的主機部分必須相同,包括子域名(subdomain)。
端口(port):這是URL中的端口號部分,通常在冒號後面指定,例如":80"或":443"。如果指定了端口,則同一個來源的資源的端口號也必須相同,如果未指定端口,則使用默認的端口號(http默認為80,https默認為443)。
同源政策的主要目的是確保網站的資源只能被它自己的網站訪問,以防止惡意網站在瀏覽器中執行釣魚攻擊、盜取用戶敏感信息等不當行為。以下是一個例子來說明同源政策:
假設現在有兩個網站,網站A是https://example.com
,網站B是https://malicious.com
以網站A做例子,先忽略網站Bhttps://example.com
網站的JavaScript程式碼中嘗試訪問https://example.com/secret
上的資源,這是同源,被允許的,因為它們的來源相同。
URL | 是否同源 | 原因 |
---|---|---|
https://example.com/secret |
是 | |
http//example.com |
否 | 不同協定protocol |
https://example.com:6000 |
否 | 不同端口port |
https://happy.com |
否 | 不同主機host |
再來,以網站B做例子
如果在https://malicious.com
上的JavaScript代碼嘗試訪問https://malicious.com/evil
上的資源,這也是允許的,因為它們的來源相同。
和同源的相反的情況就是
跨源情況(Cross-Origin Situation)
跨源情況下:
如果在https://example.com
的JavaScript代碼中嘗試訪問https://malicious.com/evil
上的資源,這就會違反同源政策,瀏覽器會阻止這樣的請求,因為它們的來源不同。這樣做可以防止惡意網站對其他網站的資源進行未授權的訪問。
用一個簡單的例子來解釋CORS跨來源資源共用:
網站Ahttps://example.com
並且使用者在該網站上運行JavaScript程式碼,該程式碼嘗試從網站B是https://malicious.com
上請求資源,例如JSON數據。
因為有同源政策(Same-Origin Policy),瀏覽器默認情況下不允許這種跨來源請求,因為網站A和網站B不屬於相同的來源。
那CORS的用途是什麼呢?
CORS可以允許網站A在瀏覽器中請求網站B的資源,但是需要網站B明確地設置CORS規則以允許這種跨來源請求。
有機會的話,未來繼續說明CORS規則。
CORS是增強瀏覽器的安全性,同時允許網站之間進行有限的跨來源資源共用。
以下是CORS的主要目的:
安全性:CORS旨在防止跨站請求偽造(Cross-Site Request Forgery,CSRF)和跨站點腳本攻擊(Cross-Site Scripting,XSS)等安全攻擊。它確保網頁僅能訪問來自相同來源的資源,防止惡意網站在瀏覽器中執行不當操作。
防止資訊外洩:CORS可以防止用戶的敏感資訊在未授權的情況下被其他網站訪問。這可以通過僅允許特定來源訪問資源來實現。
資源共用:儘管CORS強調安全性,但它同時允許網站之間進行一定程度的資源共用。這是通過在伺服器端設置CORS標頭來實現的,使伺服器可以指定哪些來源網站被允許訪問它的資源。
跨域API請求:CORS使得跨網域的API請求變得可能。這對於網站之間的合作和資源共用非常重要。例如,一個前端網站可以通過CORS設置來訪問另一個後端API服務,以獲取數據或執行操作。