Beyond XSS 3-1 ~ 3-3 #4

Chious · 2024-12-06T02:39:49Z

Chious
Dec 6, 2024
Collaborator

3-1 ~ 3-3 原型練攻擊導讀筆記

導讀：Shirley
筆記工: Sam
簡報：https://app.heptabase.com/w/809d04acdf3a2e63b671cec9f2ce7bcf3b263462432fc348f6ce83bbea572ea9?id=62ffe53f-4f27-4550-978d-50e89fdd6c28

Part I ：上週主題回顧：

Q1: Sanitizer API 與第三方套件 DOMPurify 相比有什麼特點？

A: Sanitizer API 的特點是「不管你怎麼用怎麼設定，都不會有 XSS 的產生」。這是優點也是缺點，因為它的限制很嚴格，某些合法的標籤（如 <iframe>）即使設定允許也會被移除，彈性較低。相較之下，DOMPurify 可以自訂允許哪些標籤跟屬性，較為彈性。

Q2: 什麼是 Universal XSS (UXSS)？它與一般的 XSS 有什麼不同？

A: Universal XSS 是針對瀏覽器或內建 plugin 的漏洞進行攻擊，而不是針對網站本身。它的特點是即使網站本身沒有任何問題，甚至是純靜態網頁，都可能受到攻擊。UXSS 可以做到「無論在哪個網站都可以執行程式碼」，影響範圍比一般 XSS 更廣。

Q3: CSP bypass 中，base-uri 的設定為什麼重要？

A: 如果沒有設定 base-uri，攻擊者可以透過插入<base>標籤改變所有相對路徑的參考位置，進而載入惡意的腳本。因此建議在 CSP 中加入 base-uri 'none' 來阻擋所有的 base 標籤。

Q4: Trusted Types 的主要功能是什麼？

A: Trusted Types 的功能不是「確定你的 HTML 沒問題」，而是「強制在有可能出問題的 DOM API 使用 Trusted Types，不能使用字串」。當開發者忘記處理使用者輸入時，瀏覽器會直接拋出錯誤，而不會把未處理過的字串當作 HTML 直接 render。

Q5: 什麼是 Mutation XSS (mXSS)？請解釋其原理。

A: Mutation XSS 是利用瀏覽器對 HTML 的自動修復機制所產生的攻擊。當 HTML 在瀏覽器中被解析時，某些元素的結構會被瀏覽器自動改變（mutation），這種變化可能導致原本看似安全的 HTML 變得不安全。例如 <svg> 中的元素可能會「跳出」到外層。

正式的導讀開始囉 🎉

不直接執行 Javascript 的攻擊手法（3-1~3-3）

3-1 原型鏈的攻擊方式

什麼是 WAF（Web Application Firewall）防禦的五個階段

透過原型練攻擊，可以達到什麼好處？

攻擊 Server 端

什麼是原型鏈？

編輯者補充：原型鏈是 JavaScript 物件之間的連結，可以透過繼承的方式來拿到母層物件的方法或屬性，這樣可以達到程式碼重複利用的效果。
舉例來說我們建立一個物件const arr = [] 即從 Array.prototype 繼承了 push、pop 等方法。

原型鏈 (Prototype Chain)
├── Object.prototype  (所有物件的原型)
│   ├── hasOwnProperty
│   ├── isPrototypeOf
│   ├── toString
│   ├── ...
├── Function.prototype (所有函式的原型)
│   ├── apply
│   ├── bind
│   ├── call
│   ├── ...
├── Array.prototype   (所有陣列的原型)
│   ├── push
│   ├── pop
│   ├── map
│   ├── ...
├── MyObject.prototype (自定義物件的原型)
    ├── myMethod
    ├── myProperty
└── myObject         (實例物件)

其中 __proto__ 是 JavaScript 物件的一個隱藏屬性，用來訪問物件的原型，同時攻擊者可以透過這個屬性來串接原型鏈，進而修改原本不該被修改的物件。

編輯者補充：最常見的 JavaScript 原型 (prototype) 面試題：原型 (prototype)、原型鏈 (prototype chain) 、原型繼承 (prototypal inheritance)

如何透過 prototype chain 進行攻擊？

function parseQs(qs) {
  let result = {};
  let arr = qs.split('&');
  for (let item of arr) {
    let [key, value] = item.split('=');
    if (!key.endsWith(']')) {
      // 針對一般的 key=value
      result[key] = value;
      continue;
    }

    // 針對物件
    let items = key.split('[');
    let obj = result;
    for (let i = 0; i < items.length; i++) {
      let objKey = items[i].replace(/]$/g, '');
      if (i === items.length - 1) {
        obj[objKey] = value;
      } else {
        if (typeof obj[objKey] !== 'object') {
          obj[objKey] = {};
        }
        obj = obj[objKey];
      }
    }
  }
  return result;
}

var qs = parseQs('test=1&a[b][c]=2');
console.log(qs);
// { test: '1', a: { b: { c: '2' } } }

什麼時候會發生？

解析 URL query string 時，如果沒有對 key 做過濾，攻擊者可以透過 key 的值串接原型鏈，進而修改原本不該被修改的物件。
合併/操作物件時，如果沒有對 key 做過濾，攻擊者可以透過 key 的值串接原型鏈，進而修改原本不該被修改的物件。

例如：

// 原本的物件
let obj = { a: 1, b: 2 };

// 攻擊者傳入的 query string
let qs = 'constructor.prototype.test=3';

// 解析 query string
let parsed = parseQs(qs);

// 合併物件
Object.assign(obj, parsed);

console.log(obj);

// { a: 1, b: 2, test: 3 }

如何防範？

阻止使用者訪問 __proto__ 屬性
使用 Object.create(null) 創建沒有原型鏈的物件
凍結物件，例如Object.freeze(obj)，避免物件被修改
使用 Reflect API 來操作物件，例如 Reflect.set(obj, key, value)

Question：為什麼操作 Key 值的時候很容易被原型練攻擊？

例如：a[b][c] 這樣的 key 值，如果沒有過濾，攻擊者可以透過 key 的值串接原型鏈，進而修改原本不該被修改的物件。

章節ＱＡ

Question：這個章節的重點是?

透過攻擊原型練，可以修改原本不該被修改的物件，進而達到攻擊的目的。

3-2 DOM Clobbering

DOM Clobbering 是一種攻擊手法，透過修改全域物件（如 window 或 document）上的屬性，來達到攻擊的目的。

1️⃣ <a> 標籤的 name 屬性

在 HTML4 中，<a> 標籤有一個 name 屬性，可以用來設定錨點。當我們點擊一個連結時，瀏覽器會自動捲動到對應的錨點位置。

舉例：

<a name="test"></a> <a href="#test">Go to test</a>

2️⃣ id 屬性

在 HTML 中，id 屬性是唯一的，不能重複。如果我們在全域物件上設定一個 id 屬性，就會覆蓋掉原本的 id 屬性。
在 prototype chain 當中，如果找不到方法或屬性，JavaScript 會往上一層原型鏈找，直到找到為止。因此，如果我們在全域物件上設定一個 id 屬性，就會覆蓋掉原本的 id 屬性。

<!DOCTYPE html>
<html>
  <body>
    <div id="TEST_MODE"></div>
    <script>
      if (window.TEST_MODE) {
        // 執行某些操作
      }
    </script>
  </body>
</html>

進階版：多層級的 DOM Clobbering

<!DOCTYPE html>
<html>
  <body>
    <form id="config">
      <input name="isTest" />
    </form>
    <a id="config" name="prod"></a>
    <script>
      console.log(window.config.isTest); // <input name="isTest" />
      console.log(window.config.prod); // <a id="config" name="prod"></a>
    </script>
  </body>
</html>

透過層級結構，攻擊者能夠覆蓋目標屬性。

(OS: 原本應該出現的屬性 eg. window.config.isTest及 window.config.prod 會被覆蓋掉)

3-3 模板注入攻擊 CSTI

模板注入攻擊（Client-Side Template Injection, CSTI）是一種攻擊手法，攻擊者可以透過注入惡意的模板語言，來執行 JavaScript 程式碼。

防禦 CSTI 攻擊的方法

過濾使用者輸入的內容，不要直接將使用者輸入的內容當作模板語言執行。
使用安全的模板語言，例如 Handlebars.js、Pug 等，這些模板語言不支援執行 JavaScript 程式碼。

Q：什麼是樣板引擎攻擊？

樣板是 Server 處理前端程式碼，靜態資料中插入動態資料並輸出

=> 由於可以透過嵌入程式碼來實際執行程式碼，因此可能會有安全性問題

=> 補充：現在的框架基本上比較不會遇到 CSTI

舉例：AngularJS 的 CSTI 攻擊

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta
      http-equiv="Content-Security-Policy"
      content="script-src https://cdnjs.cloudflare.com"
    />
  </head>
  <body>
    <div ng-app ng-csp>
      <input id=x autofocus
      ng-focus=$event.composedPath()|orderBy:'(z=alert)(1)'>
    </div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  </body>
</html>

$event.composedPath()|orderBy:'(z=alert)(1)' 是一個惡意的表達式
當輸入框被聚焦(focus)時，這段程式碼會觸發 alert(1) 彈出一個警告框
這是利用 Angular.js 的一個特殊行為和漏洞來執行任意 JavaScript 代碼

Angular.js 在早期版本（特别是 1.x 版本）对 Client 提供的表達式處理不夠嚴格。相較於 React 會在輸出前對輸入進行過濾，Angular.js 會直接執行輸入的表達式，則容易達成 CSTI 攻擊。

補充：React 的 CSTI 攻擊

is 代表自定義一個 Component，這樣可以達到執行 JavaScript 的效果。（pf: 原本執行 alert(1) 是沒有效果的）

=> 解法：只傳入需要使用到的屬性(props)

export default function Example() {
  const obj = {
    id: 'test',
    onclick: `alert(1)`,
    is: 'abc', // 代表自定義一個 Component
  };

  return (
    <div className="App">
      <h1 {...obj}>Hello</h1>
    </div>
  );
}

怎麼發現這個小技巧的？

=> CTF 競賽～
=> PICOCTF

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Beyond XSS 3-1 ~ 3-3 #4

Uh oh!

{{title}}

Uh oh!

Replies: 0 comments

Select a reply

Uh oh!

Beyond XSS 3-1 ~ 3-3 #4

Uh oh!

Chious Dec 6, 2024 Collaborator

3-1 ~ 3-3 原型練攻擊導讀筆記

Part I ：上週主題回顧：

不直接執行 Javascript 的攻擊手法（3-1~3-3）

3-1 原型鏈的攻擊方式

如何透過 prototype chain 進行攻擊？

什麼時候會發生？

章節ＱＡ

3-2 DOM Clobbering

進階版：多層級的 DOM Clobbering

3-3 模板注入攻擊 CSTI

防禦 CSTI 攻擊的方法

舉例：AngularJS 的 CSTI 攻擊

補充：React 的 CSTI 攻擊

Replies: 0 comments

Chious
Dec 6, 2024
Collaborator