瀏覽器安全:什麼是XSS攻擊?
theme: nico
本文正在參加「金石計劃 . 瓜分6萬現金大獎」
關於瀏覽器安全主要分為web頁面安全
、瀏覽器網路安全
和瀏覽器系統安全
,今天我們主要聊一聊web頁面安全
裡面的XSS(Cross Site Scripting)跨站指令碼攻擊
同源策略
協議號 - 域名 - 埠號
,只有當這三個條件同時滿足相同時,我們就稱之為符合同源策略,同源策略也可以看做是一個協議。
http:// www.baidu.com :8080 /test
協議號 域名 埠號 路徑
複製程式碼
通常我們導航的url都是由這四部分組成的。
如果兩個 URL 的協議、域名和埠都相同,我們就稱這兩個 URL 同源
http://www.baidu.com:8080/test1
http://www.baidu.com:8080/test2
瀏覽器預設兩個相同的源之間是可以相互訪問資源和操作 DOM
的。兩個不同的源之間若想要相互訪問資源或者操作 DOM
,那麼會有一套基礎的安全策略的制約,我們把這稱為同源策略
。
同源策略主要表現在三個方面: 1) DOM、 2) Web資料、 3) 網路
DOM
同源策略限制了來自不同源的 JavaScript 指令碼對當前 DOM 物件讀和寫的操作。
Web資料
同源策略限制了不同源的站點讀取當前站點的 Cookie
、IndexDB
、LocalStorage
等資料。
網路
同源策略限制了通過 XMLHttpRequest
等方式將站點的資料傳送給不同源的站點。
我們瞭解了同源策略會隔離不同源的 DOM
、頁面資料和網路通訊,進而實現 Web
頁面的安全性。
不過安全性和便利性是相互對立的,讓不同的源之間絕對隔離,無疑是最安全的措施,但這也會使得 Web 專案難以開發和使用
。因此我們就要在這之間做出權衡,讓出一些安全性來滿足靈活性;而出讓安全性又帶來了很多安全問題,最典型的是 XSS
攻擊和 CSRF
攻擊,這篇文章我們主要聊一聊 XSS
攻擊
XSS(Cross Site Scripting)
跨站指令碼攻擊指的是自己的網站運行了別的網站裡面的程式碼,攻擊原理是原本需要接受資料但是一段指令碼放置在了資料中: (黑客向html檔案中或者DOM中注入惡意指令碼,從而使用者在瀏覽頁面時注入的指令碼對使用者實施攻擊)
XSS攻擊影響
- 修改DOM,偽造頁面,欺騙使用者,獲取賬號密碼等私密資訊;
- 在內面內生成浮窗廣告;
- 可以監聽使用者的行為,比如addEventListener('keydown') // 監聽使用者的鍵盤敲擊事件
- 竊取cookie資訊
- 獲取頁面資料等
- ...
#### XSS攻擊方式
儲存型XSS攻擊
:儲存到DB後讀取時注入惡意指令碼,比如在一些評論區或者個性簽名等可以自由編寫的地方,在評論的時候寫一段script
指令碼,這樣資料就會被儲存到資料庫,當別人訪問時,載入這段評論時,瀏覽器就會識別為一段javascrip
t指令碼程式碼來執行,並且只要不刪除,就一直在,危害較大。反射型XSS攻擊
:是通過URL
引數直接注入,一般是使用alert
來探測站點是否防禦,直接攻擊的使用src
來引入自己的指令碼。
我們來看一下效果,使用node
藉助express
開啟一個後端服務,模擬
一個伺服器端
index.js
``` const express = require('express') const path = require('path') const app = express()
app.set('views', path.join(__dirname, 'views')); app.engine('html', require('ejs').renderFile); app.set('view engine', 'html');
app.get('/', function(req, res, next) { res.render('index', { title: 'Express', xss: req.query.xss }) })
app.listen(3000,() => { console.log('服務已在3000埠啟動'); })
```
當我們在訪問3000埠時在後面直接接一段script程式碼,看看會是什麼效果呢?
可以看到,我們直接被彈出的提示框,這就是反射型XSS攻擊
。
基於DOM的XSS攻擊
--- 網路劫持,修改頁面後,再讓使用者看到。
XSS防禦方式
- 在服務端將script標籤轉義掉,(
伺服器對輸入的指令碼進行過濾或轉碼
);
``` function changeCode(str) { return str.replace('<', '<'); } // 在返回資料給到瀏覽器去渲染的時候,我們先將資料交給轉義函式處理一下資料
res.render('index', { title: 'Express', xss: changeCode(req.query.xss) }) ```
那我們上面的例子來看一下效果
這樣就不會把它識別為一段惡意指令碼程式碼了。
- 充分使用
CSP
(限制載入其他域下的資原始檔、禁止向第三方提交資料)
內容安全策略 (CSP) 是一個額外的安全層,用於檢測並削弱某些特定型別的攻擊,包括跨站指令碼 (XSS) 和資料注入攻擊等。
- cookie設定 - HttpOnly (設定這個屬性之後
cookie
無法通過js去document.cookie讀取)