网站建设实训内容框架型网站
漏洞描述
点击劫持（Clickjacking）是一种网络攻击技术，攻击者通过将一个恶意的页面或按钮隐藏在合法网站的页面下，诱使用户在不知情的情况下点击隐藏的内容，从而触发攻击者设计的操作。这种攻击通常会导致用户无意中执行敏感操作，例如更改账户设置、转账、订阅或其他可能带来经济损失或安全风险的行为。
点击劫持的攻击原理
点击劫持的主要攻击原理是利用网页的iframe嵌套特性，将恶意网页通过iframe的方式嵌入到合法网站的页面上。由于攻击页面的透明度或位置设计巧妙，用户误以为在点击正常网站的按钮，但实际上触发了隐藏的恶意内容。
防御方法
使用X-Frame-Options头：通过在HTTP响应中设置X-Frame-Options: DENY或X-Frame-Options: SAMEORIGIN，防止页面被其他站点以iframe的方式嵌入。
Content Security Policy (CSP)：通过设置Content-Security-Policy: frame-ancestors 'self’来指定允许嵌入的源。
页面逻辑检测：检测页面的嵌入情况，当页面被iframe嵌入时，拒绝加载或显示警告信息。
UI设计防护：让用户在执行敏感操作时需要多次确认，避免一键点击误触风险。
JS检测方法：通过JavaScript检测自身的窗口是否被嵌套，并根据情况进行防护。
应用场景
点击劫持攻击广泛存在于金融、社交网络和电商网站等领域，用户在这些平台中误触隐蔽的按钮可能造成经济或信息的损失。因此，在设计和开发网站时，应避免iframe的滥用并采取必要的防御措施。
测试代码
将代码中src=""替换为你需要测试的Url。
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Clickjacking Demo</title><style>#wrapper {position: relative;width: 400px;height: 400px;}#fakeButton {position: absolute;top: 10px; /* Position can be adjusted to overlay a specific part of the iframe */left: 10px;width: 200px;height: 100px;background: rgba(255, 0, 0, 0.5); /* Semi-transparent red button */color: white;text-align: center;line-height: 100px;z-index: 10; /* Make sure this button is above the iframe */}iframe {position: absolute;width: 100%;height: 100%;border: none;opacity: 0.4; /* Make iframe content partially transparent to highlight the attack */}</style>
</head>
<body><div id="wrapper"><div id="fakeButton">Click Me!</div><iframe src="https://www.baidu.com"></iframe><!-- 在iframe中写入你要测试的Url --></div>
</body>
</html>效果如下：
