跨域問題 瀏覽器同源策略及原因

首先，我們看到跨域這個名詞的時候，應該嘗試拆詞解字，「跨」不用說了，「域」是什麼？這裡的域不單單指網域名稱

域 = 協議+網域名稱+埠號，例

跨域問題其實就是在乙個域裡請求其他域時出現的無法請求的問題。相信做過全棧的小夥伴們，一定對此有所了解了。

到底是什麼原因導致的跨域問題呢？為什麼我就不能請求其他域的資源呢？憑什麼啊？（有點作hhh）相信剛遇到這個問題的人都會這樣想對吧。

瀏覽器同源策略：

同源策略是乙個重要的安全策略，它用於限制乙個origin的文件或者它載入的指令碼如何能與另乙個源的資源進行互動。它能幫助阻隔惡意文件，減少可能被攻擊的媒介。

mdn 瀏覽器同源策略

也就是說你這個域的a頁面是不允許訪問其他域的b頁面的。

當然，對於前後端分離的今天，前後端分別執行在不同的機器上，每當我們請求後端的資料都會出現跨域問題，這當然是不行的。

在說解決辦法之前，我們首先要對問題充分了解才可以去解決。

第一，跨域問題是瀏覽器的同源策略，那就意味著前端存在跨域問題，而後端是完全不存在跨域問題的，它想怎麼互動就怎麼互動。（那我們是不是可以想辦法讓後端幫我們解決跨域問題呢）

第二，跨域問題最根本的問題就是瀏覽器它不讓你這麼幹。（有沒有辦法讓瀏覽器同意你這麼幹）

第三，跨域問題

1.nginx實現反向**

2.nodejs****

其實這種思路跟nginx實現反向**的思路一樣，只不過這是通過nodejs自己實現乙個反向**伺服器，而nginx是現成的，配置一下就好。

3.cors（跨域資源共享）

cors是乙個w3c標準，定義了在必須訪問跨域資源時，瀏覽器該如何和伺服器溝通。具體實現原理就是在訪問跨域資源時，使用自定義的http頭部讓瀏覽器和伺服器進行溝通，伺服器決定請求成功還是失敗。具體說來我們需要幹嘛呢？其實對於前端開發不需要做什麼，因為瀏覽器自動完成了在跨域請求時加上特定頭部，而後端需要實現如果接收到這種頭部進行的處理。

1.如果沒有dom同源策略

1.做乙個假**，通過iframe巢狀乙個真實的銀行**

2.讓iframe的寬高擠滿整個螢幕，這樣看起來與真實的**沒有區別，實際上它就是真實的**。

3.使用者輸入使用者名稱、密碼的時候，主**可以訪問銀行**的dom結點，從而拿到使用者名稱、密碼。

2.如果沒有xmlhttprequest同源策略

（xmlhttprequest物件是用於在後台和伺服器交換資料的）

1.現在你訪問了乙個**比如，這個**會將一些使用者標識存在你的本地cookie以便於下次直接登入。

2.現在你從訪問，瀏覽器會預設把的cookie傳送給它，這樣的話從2的**也可以登入，這樣就會存在很大的安全隱患。

瀏覽器同源策略和跨域請求

如果沒有同源策略，當你開啟銀行 同時又開啟了另外乙個惡意 這時，惡意 就有能力修改你這個 的dom，使你後續傳送的請求都傳送到惡意 的伺服器上，然後惡意 就能獲取到你的cookie等資訊，將會對個人的隱私財產構成巨大的威脅。如果嚴格的遵循同源策略，也會面臨很多的問題。比如，css，js等都得從同網域...

瀏覽器同源策略，及跨域解決方案

源由下面三個部分組成 網域名稱埠 協議兩個 url 只有這三個都相同的情況下，才可以稱為同源。對比url 結果原因 不同源網域名稱不同 不同源協議不同 不同源埠不同 同源同網域名稱，同埠，同協議 瀏覽器的同源策略是一種安全功能，同源策略限制了從同乙個源載入的文件或指令碼如何與來自另乙個源的資源進行互...

瀏覽器同源策略與ajax跨域方法彙總

什麼是同源策略 要了解同源策略，首先得理解 源 在這個語境下，源 origin 其實就是指的url。所以，我們需要先理解url的組成。看看這個url 我們可以將它拆解為下面幾個部分協議 網域名稱和路徑 而對於乙個更為完整的url 而同源就是指url中protocol協議 host網域名稱 port埠...