通过浏览器APIs实现客户端原型链污染
翻译
原文：https://portswigger.net/web-security/prototype-pollution/client-side/browser-apis
- name: 翻译
desc: 原文：https://portswigger.net/web-security/prototype-pollution/client-side/browser-apis
bgColor: '#F0DFB1'
textColor: 'green'
2
3
4
# 1通过浏览器APIs实现客户端原型链污染
你可能会惊讶地发现，在浏览器广泛提供的 JavaScript APIs 中有许多的原型污染小工具。在本节中，我们将向你展示如何利用这些小工具实现 DOM型XSS (opens new window)，从而绕过开发人员实现的脆弱原型链污染防御。
PortSwigger Research
本节中的实验室基于 PortSwigger 最初的研究。有关如何使用 DOM Invader 发现这些小工具的更多内容，请查看相关的博客文章。
# 2通过fetch()实现原型链污染
Fetch API 为开发人员提供了一种使用 JavaScript 发起 HTTP 请求的简单方式。fetch()方法接受两个参数：
- 请求的 URL。
- 一个 options（选项）对象，可用于控制请求的某些部分，例如方法、标头、正文参数等。
下面是一个如何使用fetch()发送POST请求的示例：
fetch('https://normal-website.com/my-account/change-email', {
method: 'POST',
body: 'user=carlos&email=carlos%40ginandjuice.shop'
})
2
3
4
正如你所看到的，我们显式地定义了method和body属性，但其中还有许多其他可选属性没有被定义。在这种情况下，如果攻击者能够找到合适的污染源，他们就可以使用自己的headers属性来污染Object.prototype。然后，传递给fetch()的 options 对象可能会继承这些被污染的属性，并用来生成稍后的请求。
这可能会导致许多问题。例如，以下代码可能容易受到原型链污染的 DOM型XSS (opens new window) 攻击：
fetch('/my-products.json',{method:"GET"})
.then((response) => response.json())
.then((data) => {
let username = data['x-username'];
let message = document.querySelector('.message');
if(username) {
message.innerHTML = `My products. Logged in as <b>${username}</b>`;
}
let productList = document.querySelector('ul.products');
for(let product of data) {
let product = document.createElement('li');
product.append(product.name);
productList.append(product);
}
})
.catch(console.error);
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
为了利用此漏洞，攻击者可以在headers属性中包含恶意的x-username标头，从而污染Object.prototype，如下所示：
?__proto__[headers][x-username]=<img/src/onerror=alert(1)>
假设在服务端中，这个标头被用来设置 JSON 文件中的x-username属性值。在上面易受攻击的客户端代码中，这个属性值将会分配给username变量，该变量稍后被传递到innerHTML接收器中，从而产生 DOM型XSS。
笔记
通过此技术，你可以控制 options 对象上的任何未定义属性，并传递给fetch()。例如，这可能使你能够向请求添加恶意正文。
# 3通过Object.defineProperty()实现原型链污染
对原型链污染有一定了解的开发人员，可能会尝试使用Object.defineProperty()方法来阻止潜在的小工具。在受影响的对象上，开发人员可以将其设置为 “不可配置、不可写” 的属性，如下所示：
Object.defineProperty(存在漏洞的对象, '小工具属性', {
configurable: false,
writable: false
})
2
3
4
这最初看起来像是一种合理的缓解措施，因为这可以防止易受攻击的对象 通过原型链 来继承小工具上的恶意属性。然而，这种方法本身就存在缺陷。
就像我们前面看到的fetch()方法一样，Object.defineProperty()也接受一个被称为 “描述符” 的 options 对象，你可以在上面的例子中看到这一点。除此之外，开发人员还可以使用这个描述符对象，为正在定义的属性设置初始值。但是，如果他们定义这个属性的唯一目的是为了防止原型链污染，那么他们可能会漏掉这个应该设置的初始值。
在这种情况下，攻击者可以使用恶意value属性来污染Object.prototype，从而绕过此防御。如果传递给Object.defineProperty()的描述符对象继承了这些恶意属性，则最终 攻击者控制的值 可能会被分配到小工具的属性上。
- name: 实验室-从业者
desc: 通过浏览器APIs实现客户端原型链污染 >>
avatar: https://fastly.statically.io/gh/clincat/blog-imgs@main/vuepress/static/imgs/docs/burpsuite-learn/public/lab-logo.png
link: https://portswigger.net/web-security/prototype-pollution/client-side/browser-apis/lab-prototype-pollution-client-side-prototype-pollution-via-browser-apis
bgColor: '#001350'
textColor: '#4cc1ff'
2
3
4
5
6
接下来呢？
目前，JavaScript 被广泛用于构建后端功能。当然，这也意味着 原型链污染 可能会发生在服务端环境中。在下一节中，你将学习如何在 Node.js 应用程序上安全地检测和利用这些漏洞。