js同源策略詳解
本文較為詳細的分析了js同源策略。分享給大家供大家參考。具體如下：
概念:同源策略是客戶端腳本（尤其是Javascript）的重要的安全度量標準。它最早出自Netscape Navigator2.0，其目的是防止某個文檔或腳本從多個不同源裝載。
這里的同源指的是：同協(xié)議，同域名和同端口。
精髓：
它的精髓很簡單：它認為自任何站點裝載的信賴內(nèi)容是不安全的。當被瀏覽器半信半疑的腳本運行在沙箱時，它們應(yīng)該只被允許訪問來自同一站點的資源，而不是那些來自其它站點可能懷有惡意的資源。
為什么要有同源限制？
我們舉例說明：比如一個黑客程序，他利用IFrame把真正的銀行登錄頁面嵌到他的頁面上，當你使用真實的用戶名，密碼登錄時，他的頁面就可以通過Javascript讀取到你的表單中input中的內(nèi)容，這樣用戶名，密碼就輕松到手了。
Ajax應(yīng)用：
在Ajax應(yīng)用中這種安全限制被突破。
在普通的Javascript應(yīng)用中，我們可以修改Frame的href，或者IFrame的src，以實現(xiàn)GET方式的跨域提交，但是卻不能訪問跨域的Frame/IFrame中的內(nèi)容。
而Ajax它通過XMLHTTP進行異步交互，這個對象同樣能夠與遠程的服務(wù)器進行信息交互，而且更加危險的是，XMLHTTP是一個純粹的Javascript對象，這樣的交互過程，是在后臺進行的，不被用戶察覺。因此，XMLHTTP實際上已經(jīng)突破了原有的Javascript的安全限制。
如果我們又想利用XMLHTTP的無刷新異步交互能力，又不愿意公然突破Javascript的安全策略，可以選擇的方案就是給XMLHTTP加上嚴格的同源限制。這樣的安全策略，很類似于Applet的安全策略。IFrame的限制還僅僅是不能訪問跨域HTMLDOM中的數(shù)據(jù)，而XMLHTTP則根本上限制了跨域請求的提交。
瀏覽器支持:而IE其實給這個安全策略開了兩個想當然的后門，一個是：他假設(shè)你的本地文件，自然清楚將會訪問什么內(nèi)容，所以任何你的本地文件訪問外部數(shù)據(jù)， 都不會收到任何的警告。另一個是：當你訪問的網(wǎng)站腳本打算訪問跨域的信息時， 他居然僅僅是彈出一個對話框來提醒你一下。如果一個欺詐網(wǎng)站，采用這樣的手段，提供一個假頁面給你，然后通過XMLHTTP幫你遠程登錄真實的銀行服務(wù)器。只要10個用戶里，有一個用戶糊涂一下，點了一個確定。他們的盜取帳號行為，就成功了！ 你想想看，這是何等危險的事情！
FireFox就不是這樣的做法，缺省的情況下，F(xiàn)ireFox根本就不支持跨域的XMLHTTP請求，根本就不給黑客這樣的機會。
避免同源策略：
JSON和動態(tài)腳本標記
<script type="text/javascript"
src="http://yoursiteweb.com/findItinerary?username=sachiko&
reservationNum=1234&output=json&callback=showItinerary" />
當 JavaScript 代碼動態(tài)地插入 <script> 標記時，瀏覽器會訪問 src 屬性中的 URL。這樣會導(dǎo)致將查詢字符串中的信息發(fā)送給服務(wù)器。在 清單 1中，所傳遞的是 username 和 reservation 作為名稱值對傳遞。此外，查詢字符串還包含向服務(wù)器請求的輸出格式和回調(diào)函數(shù)的名稱（即 showItinerary）。<script> 標記加載后，會執(zhí)行回調(diào)函數(shù)，并通過回調(diào)函數(shù)的參數(shù)把從服務(wù)返回的信息傳遞給該回調(diào)函數(shù)。
Ajax代理
Ajax 代理是一種應(yīng)用級代理服務(wù)器，用于調(diào)解 Web 瀏覽器和服務(wù)器之間的 HTTP 請求和響應(yīng)。Ajax 代理允許 Web 瀏覽器繞過同源策略，這樣便可以使用 XMLHttpRequest 訪問第三方服務(wù)器。要實現(xiàn)這種繞過，有如下兩種方法可供選擇：
客戶端 Web 應(yīng)用程序知道第三方 URL 并將該 URL 作為 HTTP 請求中的一個請求參數(shù)傳遞給 Ajax 代理。然后，代理將請求轉(zhuǎn)發(fā)給 [url]m.fzitv.net[/url]。注意，可以把代理服務(wù)器的使用隱藏在 Web應(yīng)用程序開發(fā)人員所使用的 Ajax 庫的實現(xiàn)中。對于 Web 應(yīng)用程序開發(fā)人員而言，它看上去可能完全不具有同源策略。
客戶端 Web 應(yīng)用程序不知道第三方 URL，并且嘗試通過 HTTP 訪問 Ajax 代理服務(wù)器上的資源。通過一個預(yù)定義的編碼規(guī)則，Ajax 代理將 所請求的 URL 轉(zhuǎn)換為第三方服務(wù)器的 URL 并代表客戶檢索內(nèi)容。這樣一來，Web 應(yīng)用程序開發(fā)人員看上去就像是在和代理服務(wù)器直接進行通信。
Greasemonkey
Greasemonkey 是一個 Firefox 擴展，它允許用戶動態(tài)地對 Web 頁面的樣式和內(nèi)容進行修改。Greasemonkey 用戶可以把用戶腳本（user script）文件與一個 URL 集合建立關(guān)聯(lián)。當瀏覽器通過該 URL 集合加載頁面時，便會執(zhí)行這些腳本。Greasemonkey 為用戶腳本的 API 提供了額外的許可（與運行在瀏覽器沙盒中的腳本的許可相比較）。
GM_XMLHttpRequest 是其中的一個 API，它從本質(zhì)上說就是一個不具有同源策略的 XMLHttpRequest。用戶腳本可以將瀏覽的內(nèi)置 XMLHttpRequest 替代為 GM_XMLHttpRequest，從而許可 XMLHttpRequest 執(zhí)行跨域訪問。
GM_XMLHttpRequest 的使用只能通過用戶同意的途徑才能受到保護。也就是說，Greasemonkey 只有在建立新用戶腳本與特定 URL 的集合之間的關(guān)聯(lián)時才會要求用戶配置。然而，不難想象一些用戶可能會被欺騙，在沒有完全理解其后果時就接受該安裝。
希望本文所述對大家的javascript程序設(shè)計有所幫助。
相關(guān)文章
這篇文章主要為大家詳細介紹了js實現(xiàn)百度登錄框鼠標拖拽效果的相關(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-03-03
這篇文章主要介紹了JavaScript獲得表單target屬性的方法,涉及javascript操作表單屬性的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-04-04
JS動態(tài)添加元素及綁定事件造成程序重復(fù)執(zhí)行解決
這篇文章主要給大家介紹了關(guān)于JS動態(tài)添加元素及綁定事件造成程序重復(fù)執(zhí)行的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面來一起看看吧。2017-12-12
JS實現(xiàn)不用中間變量temp 實現(xiàn)兩個變量值得交換方法
這篇文章主要介紹了在JS中 實現(xiàn)不用中間變量temp 實現(xiàn)兩個變量值得交換 ,需要的朋友可以參考下2018-02-02
使用window.prompt()實現(xiàn)彈出用戶輸入的對話框
window對象的最后一種對話框是提示對話框，它顯示了預(yù)先設(shè)置的信息并提供文本域供用戶輸入應(yīng)答。它包括兩個按鈕，即Cancel和Ok，允許用戶用兩個相反的期望值來關(guān)閉這個對話框：取消整個操作或接收輸入到對話框中的文本2015-04-04
這篇文章主要為大家詳細介紹了JS實現(xiàn)輪播圖效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-01-01
這篇文章主要介紹了Javascript三種字符串連接方式及性能比較，本文給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下2019-05-05
這篇文章主要為大家詳細介紹了原生js實現(xiàn)抽獎小游戲，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-06-06
微信小程序 配置頂部導(dǎo)航條標題顏色的實現(xiàn)方法
這篇文章主要介紹了微信小程序 配置頂部導(dǎo)航條標題顏色的實現(xiàn)方法的相關(guān)資料,希望通過本文能幫助到大家，需要的朋友可以參考下2017-09-09
現(xiàn)在面試過程當中 ，手寫題必然是少不了的，其中碰到比較多的無非就是當屬 請求并發(fā)控制了，所以本文為大家整理了JS使用Promise控制請求并發(fā)數(shù)的示例代碼，希望對大家有所幫助2023-05-05