# 【juice-shop】★ DOM XSS：搜索框里的“魔法”

# 【juice-shop】★ DOM XSS：搜索框里的“魔法”

## 0x01 任务简报

<blockquote style="border-left: 5px solid #6f42c1; background-color: #f5f3ff; padding: 20px; margin: 1.5rem 0; color: #5521b5; line-height: 1.8; border-radius: 0 5px 5px 0;">
<div style="font-weight: bold; font-size: 1.1rem; margin-bottom: 10px; display: flex; align-items: center;">
<span style="margin-right: 8px;">💡</span> 核心线索 (Hints)
</div>

1.  <strong>找回显</strong>：寻找一个输入后内容会直接跳进 HTML 的字段。<br>
2.  <strong>看本质</strong>：别被表面迷惑，重点在于程序<strong>如何处理</strong>你的输入。
    </blockquote>

<blockquote style="border-left: 5px solid #0366d6; background-color: #f1f8ff; padding: 20px; margin: 1.5rem 0; color: #0550ae; line-height: 1.8; border-radius: 0 5px 5px 0;">
<div style="font-weight: bold; font-size: 1.1rem; margin-bottom: 10px; display: flex; align-items: center;">
<span style="margin-right: 8px;">🎓</span> 实战动作 (Action)
</div>
• <strong>目标</strong>：屏幕顶部的 <strong>Search field（搜索栏）</strong>。<br>
• <strong>预热</strong>：尝试搜索 <code>owasp</code> 并回车。<br>
• <strong>变招</strong>：尝试注入 HTML/JS 代码进行 <strong>XSS 攻击</strong>。
</blockquote>

-----

## 0x02 实战：复现漏洞

**1. 准备武器 (Payload)**
从计分板直接复制这行“弹窗指令”备用：

```js
<iframe src="javascript:alert(`xss`)">
```

**2. 寻找靶心**
根据提示，目标就在这里：

![](../../../../../../public/p/juice-shop-dom-xss搜索框里的魔法/assets/Pastedimage20260328172956.png)

**3. 触发陷阱**
将 Payload 填入搜索框 -> 回车 -> **Boom!** 弹窗出现，漏洞确认。

![](../../../../../../public/p/juice-shop-dom-xss搜索框里的魔法/assets/Pastedimage20260328173107.png)

-----

## 0x03 源码审计：编码挑战

### 🔍 找到它 (Find It)

漏洞位于 **第 6 行**：

![](../../../../../../public/p/juice-shop-dom-xss搜索框里的魔法/assets/Pastedimage20260328173222.png)

### 🛠️ 修复它 (Fix It)

![](../../../../../../public/p/juice-shop-dom-xss搜索框里的魔法/assets/Pastedimage20260328173242.png)

面对四个选项，为什么选 **Fix 2**？

| 选项        | 处理方式               | 安全评价               | 结论       |
| :-------- | :----------------- | :----------------- | :------- |
| **Fix 1** | `trustScript`      | ❌ 依然执行 JS          | 换个姿势被黑   |
| **Fix 2** | **直接赋值**           | ✅ **Angular 自动编码** | **真·修复** |
| **Fix 3** | `trustResourceUrl` | ❌ 依然加载恶意链接         | 掩耳盗铃     |
| **Fix 4** | `trustStyle`       | ❌ 可能导致 CSS 注入      | 治标不治本    |

-----

## 0x04 参考资料

  * 📖 [OWASP: DOM based XSS 防御手册](https://cheatsheetseries.owasp.org/cheatsheets/DOM_based_XSS_Prevention_Cheat_Sheet.html)