跨域訪問與同源策略

2022-05-16 19:31:49 字數 1568 閱讀 1071

因為在同乙個瀏覽器視窗中能夠同時開啟多個**的頁面,而且它們都處於同乙個會話中,如果不禁止跨域訪問則會造成使用者隱私資料洩露和登入身份冒用的問題,所以瀏覽器會使用同源策略限制跨域訪問。

跨域訪問被禁止有時會給應用開發帶來阻礙,但在符合特定條件時也有相應的方法在保證安全的情況下能夠解決跨域訪問的問題。

在對方的伺服器中的響應頭中新增 access-control-allow-origin 允許哪些域進行跨域訪問它是值可以是 網域名稱,或者 * 。這種方案只有在對方信任或不在乎(安全)的情況下才能使用。

如果網域名稱都是同乙個根網域名稱的子網域名稱,則可以使用document.domain = "根網域名稱" 來統一js執行環境中的網域名稱。這種方案只能在同乙個公司或組織的內部使用。

jsonp    json padding,原理是:瀏覽器不限制通過script標籤引入其它**的指令碼,所以可以通過js向頁面上動態新增乙個script標籤並且指定其 src 為乙個特殊的url,對方的伺服器針對這個url的請求,會進行特殊處理,如:

向head標籤中動態新增以下script標籤

會導致瀏覽器向上述url發起乙個get請求(jsonp只能是get請求)

對方的伺服器收到這個請求後,會返回乙個特殊的js檔案:

functionname && functionname()

如果此時在頁面中定義了functionname函式,則functionname函式會被呼叫,並且能夠得到天氣資料!

這種將json資料放入指定函式引數位置的跨域訪問解決方案被稱為jsonp。即使用json填充函式後面的()內部的空白(padding)

這種方案可以跨域任意網域名稱,但是必是對方有意這樣設計才能使用。如果對方不支援將json資料padding到函式名後面的()中,則jsonp無法使用。

在jquery中 $.getjson() 這個方法支援 jsonp !!!

在url後面加 callback=? 即可,jquery會自動生成函式名並將呼叫轉交給getjson中的**函式。

將要請求的url傳送給自己的服務端,讓服務端發起請求(服務端沒有跨域限制),服務端請求成功後,將資料再回傳給瀏覽中的js----服務端**請求。

這種方式只要自己的服務端支援一下就可以了,是比較常用的方案,沒有任何限制,而且這種方安還可以實現其它方案無法實現的功能:

通過服務端抓取別人的網頁,將網頁上的資料提取出來,變成json返回

在node.js中,使用cheerio模組可以像使用jquery一樣從html字串中篩選並提取想要的資料。

使用任何可以利用的瀏覽器端中間機制實現跨域交換資料,如:

window.name在**中使用name變數時實際上使用的是window物件的name屬性,但是name屬性是window物件的內部屬性。它只接受字串值,如果給它賦其它值,將會直接被轉換成字串!!!!尤其是賦乙個物件給name變數的時候,會導致資料丟失!!!(物件tostring()後是[object object])。但是name有一特別性質可以被用來做跨域資料交換name值不會隨全域性作用域被銷毀,不管視窗跳轉到哪個頁面,不管視窗開啟了多少個頁面,name的值都是通用的。其它的,諸如 location.hash 也可以用來做跨域資料交換(主要是iframe)

跨域 同源策略

為了保護智財權,不然你做的介面別人 都隨便用了 是瀏覽器拒絕的 一般有三種方法,哪三種方法呢?是下面三種方法 function handledata data 把callback handledata發給伺服器,伺服器拿到handledataconst http callback就是 後面的fn,因...

同源策略和跨域

url由三部分組成 資源型別 存放資源的主機網域名稱 資源檔名。也可認為由4部分組成 協議 主機 埠 路徑 url的一般語法格式為 帶方括號的為可選項 protocol hostname port path parameters query fragment protocol 協議 指定使用的傳輸協...

,同源策略和跨域

當前頁面的url 和目標請求的url不一樣 是瀏覽器的一種安全策略 所謂同源就是同乙個源頭。官方同源 協議 埠號 網域名稱必須完全相同 違背同源策略就是跨域 當前頁面的url 和目標請求的url不一樣 jsonp,jsonp是非官方的跨域解決方案,只支援get請求。它借助script標籤的跨域能力來...