摘要:同源策略是什么同源策略是瀏覽器的一個(gè)安全功能,不同源的數(shù)據(jù)禁止訪問(wèn)?;蛟S你可以說(shuō)驗(yàn)證,在瀏覽器沒(méi)有同源策略的情況下這些都可以繞過(guò)去??偨Y(jié)同源策略是蠻好的,防御了大部分的攻擊。
前端最基礎(chǔ)的就是 HTML+CSS+Javascript。掌握了這三門(mén)技術(shù)就算入門(mén),但也僅僅是入門(mén),現(xiàn)在前端開(kāi)發(fā)的定義已經(jīng)遠(yuǎn)遠(yuǎn)不止這些。前端小課堂(HTML/CSS/JS),本著提升技術(shù)水平,打牢基礎(chǔ)知識(shí)的中心思想,我們開(kāi)課啦(每周四)。
同源策略是什么?同源策略是瀏覽器的一個(gè)安全功能,不同源的數(shù)據(jù)禁止訪問(wèn)。
所以 lilnong.top 下的 ajax 訪問(wèn) 51vv.com 數(shù)據(jù)是會(huì)報(bào)錯(cuò)。(network 可以看到 response,證明限制是瀏覽器方的限制)
當(dāng)然,也有例外
表單提交、鏈接
這些項(xiàng)等同于切換頁(yè)面
script標(biāo)簽的src、link標(biāo)簽的href、img標(biāo)簽的src、iframe標(biāo)簽的src
上述的資源可以引用,但是不可獲取內(nèi)容。
img 可以顯示出來(lái),但是你無(wú)法放入canvas二次使用,會(huì)把canvas的源污染。
iframe 可以顯示,不可以獲取DOM
script 不可獲取報(bào)錯(cuò)代碼位置。
同源的定義端口、域名、協(xié)議 都相同,定義為同源。
針對(duì)http://www.lilnong.top/static這個(gè)地址來(lái)說(shuō)。端口(80),域名(www.lilnong.top),協(xié)議(http)
URL | 端口 | 域名 | 協(xié)議 | 描述 |
---|---|---|---|---|
https://www.lilnong.top | 80 | www.lilnong.top | https | 協(xié)議不同,不同源 |
http://lilnong.top | 80 | lilnong.top | http | 域名不同,不同源 |
http://lilnong.top:8080 | 8080 | lilnong.top | http | 域名不同,端口不同,不同源 |
http://www.lilnong.top:8080 | 8080 | www.lilnong.top | http | 端口不同,不同源 |
http://www.lilnong.top/ | 80 | www.lilnong.top | http | 同源 |
http://www.51vv.com | 80 | www.51vv.com | http | 域名不同,不同源 |
安全問(wèn)題
例子1:普通的網(wǎng)絡(luò)用戶,不會(huì)去記域名等內(nèi)容。如果我在我自己的頁(yè)面內(nèi),嵌套一個(gè)并把他放大,不就和淘寶一模一樣了?并且還會(huì)有淘寶的狀態(tài)信息。
這時(shí)候我們可以獲取用戶的密碼、給用戶創(chuàng)建訂單、注銷用戶的賬戶等等有危害性的操作。
例子2:領(lǐng)導(dǎo)說(shuō)要一個(gè)騰訊新聞。嗯好,我們放大自適應(yīng)。
這時(shí)候,我們可以加點(diǎn)小廣告,截獲一些用戶操作。分分鐘不花錢。得到了一個(gè)騰訊新聞。
數(shù)據(jù)歸屬問(wèn)題
大家都知道爬蟲(chóng)吧。想起來(lái)前幾天在思否看到的頭條(“飯友”APP 未經(jīng)許可抓取微博數(shù)據(jù),被判賠償210萬(wàn))。
如果說(shuō)沒(méi)有同源策略,飯友直接 ajax 拉取微博數(shù)據(jù)?;蛟S你可以說(shuō) referer 驗(yàn)證,在瀏覽器沒(méi)有同源策略的情況下這些都可以繞過(guò)去。
微博方看到的就是一個(gè)正常的微博用戶,正常的ip,訪問(wèn)了他們的接口。
那么爬蟲(chóng)呢?爬蟲(chóng)是主動(dòng)觸發(fā)的操作,是他們使用他們的ip,偽造成一個(gè)合理的用戶,去抓取數(shù)據(jù)。
同源策略是蠻好的,防御了大部分的攻擊。但是合理是合理,一些特殊情況下我們也是要繞過(guò)這個(gè)策略,下節(jié)我們講跨域。
微信公眾號(hào):前端linong 初級(jí)階段文章目錄前端培訓(xùn)-初級(jí)階段(17) - 數(shù)據(jù)存儲(chǔ)(cookie、session、stroage)
前端培訓(xùn)-初級(jí)階段(13) - 正則表達(dá)式
前端培訓(xùn)-初級(jí)階段(13) - 類、模塊、繼承
前端培訓(xùn)-初級(jí)階段(13) - ECMAScript (內(nèi)置對(duì)象、函數(shù))
前端培訓(xùn)-初級(jí)階段(13) - ECMAScript (語(yǔ)法、變量、值、類型、運(yùn)算符、語(yǔ)句)
前端培訓(xùn)-初級(jí)階段(13、18)
前端培訓(xùn)-初級(jí)階段(9 -12)
前端培訓(xùn)-初級(jí)階段(5 - 8)
前端培訓(xùn)-初級(jí)階段(1 - 4)
中級(jí)階段文章目錄前端培訓(xùn)-中級(jí)階段(2) - 事件(event) 事件冒泡、捕獲 - (2019-06-20期)
前端培訓(xùn)-中級(jí)階段(3) - DOM 文檔對(duì)象模型(2019-06-27期)
前端培訓(xùn)-中級(jí)階段(4)- BOM 瀏覽器對(duì)象模型(2019-07-04期)
前端培訓(xùn)-中級(jí)階段(5)- jQuery的概念與基本使用(2019-07-11期)
前端培訓(xùn)-中級(jí)階段(6)- jQuery元素節(jié)點(diǎn)操作(2019-07-18期)
前端培訓(xùn)-中級(jí)階段(7)- jQuery的事件綁定鏈?zhǔn)讲僮骷霸恚?019-07-25期)
前端培訓(xùn)-中級(jí)階段(8)- jQuery元素屬性樣式操作(2019-08-01期)
前端培訓(xùn)-中級(jí)階段(9)- 原生Ajax的運(yùn)行原理與實(shí)現(xiàn)(2019-08-08期)
資料前端培訓(xùn)目錄、前端培訓(xùn)規(guī)劃、前端培訓(xùn)計(jì)劃
瀏覽器同源策略及跨域的解決方法
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/105773.html
摘要:上節(jié)我們講了同源策略,這節(jié)我們講講如何跨域。當(dāng)這些從的腳本執(zhí)行出錯(cuò),因?yàn)檫`背了同源策略為了保證用戶信息不被泄露,錯(cuò)誤信息不會(huì)顯示出來(lái),取而代之只會(huì)返回一個(gè)。 前端最基礎(chǔ)的就是 HTML+CSS+Javascript。掌握了這三門(mén)技術(shù)就算入門(mén),但也僅僅是入門(mén),現(xiàn)在前端開(kāi)發(fā)的定義已經(jīng)遠(yuǎn)遠(yuǎn)不止這些。前端小課堂(HTML/CSS/JS),本著提升技術(shù)水平,打牢基礎(chǔ)知識(shí)的中心思想,我們開(kāi)課啦(每...
摘要:前端最基礎(chǔ)的就是。幫助從舊的事件方法轉(zhuǎn)換,和。方法移除用綁定的事件處理程序。特定的事件處理程序可以被移除元素上提供事件名稱,命名空間,處理函數(shù)。用于過(guò)濾器的觸發(fā)事件的選擇器元素的后代。事件觸發(fā)模擬觸發(fā)原生使用觸發(fā)。 前端最基礎(chǔ)的就是 HTML+CSS+Javascript。掌握了這三門(mén)技術(shù)就算入門(mén),但也僅僅是入門(mén),現(xiàn)在前端開(kāi)發(fā)的定義已經(jīng)遠(yuǎn)遠(yuǎn)不止這些。前端小課堂(HTML/CSS/JS)...
摘要:前端最基礎(chǔ)的就是。幫助從舊的事件方法轉(zhuǎn)換,和。方法移除用綁定的事件處理程序。特定的事件處理程序可以被移除元素上提供事件名稱,命名空間,處理函數(shù)。用于過(guò)濾器的觸發(fā)事件的選擇器元素的后代。事件觸發(fā)模擬觸發(fā)原生使用觸發(fā)。 前端最基礎(chǔ)的就是 HTML+CSS+Javascript。掌握了這三門(mén)技術(shù)就算入門(mén),但也僅僅是入門(mén),現(xiàn)在前端開(kāi)發(fā)的定義已經(jīng)遠(yuǎn)遠(yuǎn)不止這些。前端小課堂(HTML/CSS/JS)...
摘要:前端最基礎(chǔ)的就是。對(duì)應(yīng),是標(biāo)簽的屬性。獲取匹配元素相對(duì)父元素的偏移。返回的對(duì)象包含兩個(gè)整型屬性和。一組包含作為動(dòng)畫(huà)屬性和終值的樣式屬性和及其值的集合動(dòng)畫(huà)的額外選項(xiàng)。指示是否在效果隊(duì)列中放置動(dòng)畫(huà)。 前端最基礎(chǔ)的就是 HTML+CSS+Javascript。掌握了這三門(mén)技術(shù)就算入門(mén),但也僅僅是入門(mén),現(xiàn)在前端開(kāi)發(fā)的定義已經(jīng)遠(yuǎn)遠(yuǎn)不止這些。前端小課堂(HTML/CSS/JS),本著提升技術(shù)水平,...
摘要:前端最基礎(chǔ)的就是。對(duì)應(yīng),是標(biāo)簽的屬性。獲取匹配元素相對(duì)父元素的偏移。返回的對(duì)象包含兩個(gè)整型屬性和。一組包含作為動(dòng)畫(huà)屬性和終值的樣式屬性和及其值的集合動(dòng)畫(huà)的額外選項(xiàng)。指示是否在效果隊(duì)列中放置動(dòng)畫(huà)。 前端最基礎(chǔ)的就是 HTML+CSS+Javascript。掌握了這三門(mén)技術(shù)就算入門(mén),但也僅僅是入門(mén),現(xiàn)在前端開(kāi)發(fā)的定義已經(jīng)遠(yuǎn)遠(yuǎn)不止這些。前端小課堂(HTML/CSS/JS),本著提升技術(shù)水平,...
閱讀 968·2023-04-25 23:50
閱讀 2001·2021-11-19 09:40
閱讀 613·2019-08-30 13:50
閱讀 2742·2019-08-29 17:11
閱讀 1053·2019-08-29 16:37
閱讀 2998·2019-08-29 12:54
閱讀 2808·2019-08-28 18:17
閱讀 2651·2019-08-26 16:55