> For the complete documentation index, see [llms.txt](https://hacktricks.xsx.tw/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://hacktricks.xsx.tw/pentesting-web/xss-cross-site-scripting/debugging-client-side-js.md).

# Debugging Client Side JS

## 调试客户端JS

<details>

<summary><strong>从零开始学习AWS黑客技术，成为专家</strong> <a href="https://training.hacktricks.xyz/courses/arte"><strong>htARTE（HackTricks AWS红队专家）</strong></a><strong>！</strong></summary>

支持HackTricks的其他方式：

* 如果您想看到您的**公司在HackTricks中做广告**或**下载PDF格式的HackTricks**，请查看[**订阅计划**](https://github.com/sponsors/carlospolop)!
* 获取[**官方PEASS＆HackTricks周边产品**](https://peass.creator-spring.com)
* 探索[**PEASS家族**](https://opensea.io/collection/the-peass-family)，我们的独家[**NFTs**](https://opensea.io/collection/the-peass-family)收藏品
* **加入** 💬 [**Discord群**](https://discord.gg/hRep4RUj7f) 或 [**电报群**](https://t.me/peass) 或在**Twitter**上关注我们 🐦 [**@carlospolopm**](https://twitter.com/hacktricks_live)**。**
* 通过向[**HackTricks**](https://github.com/carlospolop/hacktricks)和[**HackTricks Cloud**](https://github.com/carlospolop/hacktricks-cloud) github仓库提交PR来分享您的黑客技巧。

</details>

调试客户端JS可能会很麻烦，因为每次更改URL（包括使用的参数或参数值的更改）时，您需要**重置断点并重新加载页面**。

### `debugger;`

如果您在JS文件中放置`debugger;`一行，当**浏览器**执行JS时，它将在那个位置**停止** **调试器**。因此，设置常量断点的一种方法是**将所有文件下载到本地并在JS代码中设置断点**。

### 覆盖

浏览器覆盖允许拥有将要执行的代码的本地副本并执行该本地副本，而不是来自远程服务器的副本。\
您可以在“开发者工具” --> “源” --> “覆盖”中**访问覆盖**。

您需要**创建一个本地空文件夹用于存储覆盖**，因此只需创建一个新的本地文件夹并将其设置为该页面的覆盖。

然后，在“开发者工具” --> “源”中**选择要覆盖的文件**，然后用**右键单击选择“保存以覆盖”**。

![](/files/WtJy4TkSUd5uAT44XjZs)

这将**在本地复制JS文件**，您将能够在浏览器中**修改该副本**。因此，只需在您想要的任何位置添加\*\*`debugger;`**命令，保存更改并**重新加载**页面，每次访问该网页时**将加载您的本地JS副本\*\*，并保持您的调试器命令在其位置：

![](/files/xVBs1UlfLMKdqJJ5SqnI)

## 参考资料

* <https://www.youtube.com/watch?v=BW_-RCo9lo8&t=1529s>

<details>

<summary><strong>从零开始学习AWS黑客技术，成为专家</strong> <a href="https://training.hacktricks.xyz/courses/arte"><strong>htARTE（HackTricks AWS红队专家）</strong></a><strong>！</strong></summary>

支持HackTricks的其他方式：

* 如果您想看到您的**公司在HackTricks中做广告**或**下载PDF格式的HackTricks**，请查看[**订阅计划**](https://github.com/sponsors/carlospolop)!
* 获取[**官方PEASS＆HackTricks周边产品**](https://peass.creator-spring.com)
* 探索[**PEASS家族**](https://opensea.io/collection/the-peass-family)，我们的独家[**NFTs**](https://opensea.io/collection/the-peass-family)收藏品
* **加入** 💬 [**Discord群**](https://discord.gg/hRep4RUj7f) 或 [**电报群**](https://t.me/peass) 或在**Twitter**上关注我们 🐦 [**@carlospolopm**](https://twitter.com/hacktricks_live)**。**
* 通过向[**HackTricks**](https://github.com/carlospolop/hacktricks)和[**HackTricks Cloud**](https://github.com/carlospolop/hacktricks-cloud) github仓库提交PR来分享您的黑客技巧。

</details>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://hacktricks.xsx.tw/pentesting-web/xss-cross-site-scripting/debugging-client-side-js.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.