目录
一、XSS 攻击概述
XSS(Cross - Site Scripting)跨站脚本攻击是一种常见的网络安全漏洞。攻击者通过在目标网站注入恶意脚本(通常是 JavaScript),当用户访问被攻击的页面时,这些恶意脚本会在用户的浏览器中执行,从而获取用户的敏感信息(如登录凭证、个人资料等)、篡改页面内容或者代表用户执行一些非预期的操作。
二、XSS 攻击原理
- 反射型 XSS 原理
当用户访问一个带有恶意参数的 URL 时,服务器会将这个参数值包含在响应页面中,并且没有对其进行正确的编码。攻击者构造的恶意脚本作为参数传入,然后浏览器在解析这个包含恶意脚本的页面时就会执行它。例如,一个搜索功能的网站,如果搜索关键词没有被正确处理,攻击者可以构造类似 “<script>alert('XSS')</script>” 作为关键词,当搜索结果页面显示这个关键词时,就会触发弹窗。 - 存储型 XSS 原理
攻击者将恶意脚本存储在目标服务器的数据库或其他存储介质中。比如在一个论坛的评论功能中,如果用户输入的内容没有经过严格过滤就存储到数据库,攻击者可以在评论中插入恶意脚本。当其他用户访问包含这个评论的页面时,脚本就会执行,可能导致信息泄露或其他恶意行为。 - DOM - based XSS 原理
这种类型的 XSS 利用了网页中 DOM(Document Object Model)操作的漏洞。攻击者通过修改页面的 DOM 结构,使得恶意脚本被执行。例如,通过修改页面的 URL 哈希值或者使用 JavaScript 中的某些方法来改变页面内容,从而引入恶意脚本。
三、XSS 攻击步骤与代码示例
- 前端部分(Vue3 + TS) - 模拟存在 XSS 漏洞的输入场景
<template>
<input type="text" v-model="userInput" @input="handleInput" />
<div v-html="displayContent"></div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
name: 'XSSVulnerableComponent',
data() {
return {
userInput: '',
displayContent: ''
};
},
methods: {
handleInput() {
// 这里存在漏洞,直接将用户输入作为HTML内容显示,可能导致XSS攻击
this.displayContent = this.userInput;
}
}
});
</script>
在这个示例中,如果用户输入恶意脚本(如 “<script>alert('XSS')</script>”),页面会直接执行该脚本。
- 后端部分(Java) - 模拟接收并处理可能包含 XSS 的输入(这里只是简单示例,实际中可能涉及数据库存储等)
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
@WebServlet("/xss-example")
public class XSSEXampleServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException {
String userInput = request.getParameter("input");
// 这里没有对用户输入进行XSS过滤,存在安全风险
PrintWriter out = response.getWriter();
out.println("<html><body>");
out.println("You entered: " + userInput);
out.println("</body></html>");
}
}
如果攻击者通过构造恶意的 “input” 参数(如包含 XSS 脚本),服务器会将其包含在响应中返回给浏览器执行。
- Python 模拟 XSS 攻击示例(仅用于演示)
import requests
# 构造包含XSS脚本的URL参数(这里是反射型XSS示例)
url = 'http://yourserver/xss-example?input=%3Cscript%3Ealert(%27XSS%27)%3C/script%3E'
response = requests.get(url)
print(response.text)
这个 Python 代码模拟了攻击者发送包含恶意脚本的请求,如果服务器没有正确处理,就会触发 XSS 攻击。
在实际的安全防护中,要对用户输入进行严格的过滤和编码,无论是在前端还是后端。对于存储型 XSS,要在存储数据前进行处理,对于反射型和 DOM - based XSS,要对传入的参数进行检查和净化,防止恶意脚本的执行。同时,要对页面的 DOM 操作进行安全审查,避免出现可被利用的漏洞。
以下是基于前面所介绍的三种 XSS(跨站脚本攻击)类型,分别给出的三种代码示例,示例中包含前端(Vue3 + TS)、后端(Java)以及用于模拟攻击的 Python 代码部分:
反射型 XSS
前端部分(Vue3 + TS)
<template>
<input type="text" v-model="searchQuery" @input="search" />
<div v-html="searchResult"></div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
name: 'ReflectedXSSComponent',
data() {
return {
searchQuery: '',
searchResult: ''
};
},
methods: {
search() {
// 这里假设会将用户输入的查询发送到后端,并将后端返回的结果展示在searchResult中
// 实际应用中应该使用axios等库来发送请求,但为了简化示例,这里省略具体发送过程
// 此处在接收到后端返回结果后直接赋值给searchResult展示,存在反射型XSS漏洞
this.searchResult = `You searched for: ${this.searchQuery}`;
}
}
});
</script>
后端部分(Java)
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
@WebServlet("/search")
public class ReflectedXSSEXampleServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException {
String searchQuery = request.getParameter("query");
// 这里没有对用户输入的查询参数进行任何XSS过滤处理,直接将其包含在响应中返回
PrintWriter out = response.getWriter();
out.println("<html><body>");
out.println("Search results for: " + searchQuery);
out.println("</body></html>");
}
}
模拟攻击的 Python 代码
import requests
# 构造包含反射型XSS脚本的URL参数
url = 'http://yourserver/search?query=%3Cscript%3Ealert(%27Reflected XSS%27)%3C/script%3E'
response = requests.get(url)
print(response.text)
存储型 XSS
前端部分(Vue3 + TS)
<template>
<textarea v-model="userComment" @input="submitComment"></textarea>
<div v-for="(comment, index) in comments" :key="index">{{ comment }}</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
name: 'StoredXSSComponent',
data() {
return {
userComment: '',
comments: []
};
},
methods: {
submitComment() {
// 这里假设会将用户输入的评论发送到后端保存,然后从后端获取所有评论并展示在前端
// 实际应用中应该使用axios等库来发送请求,但为了简化示例,这里省略具体发送过程
// 此处在接收到后端返回的评论列表后直接赋值给comments展示,存在存储型XSS漏洞
// 假设后端已经将新评论保存并返回了更新后的评论列表
this.comments.push(this.userComment);
this.userComment = '';
}
}
});
</script>
后端部分(Java)
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;
@WebServlet("/submit-comment")
public class StoredXSSEXampleServlet extends HttpServlet {
private List<String> comments = new ArrayList<>();
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException {
String userComment = request.getParameter("comment");
// 这里没有对用户输入的评论进行任何XSS过滤处理,直接将其保存到comments列表中
// 然后将更新后的评论列表返回给前端展示
comments.add(userComment);
PrintWriter out = response.getWriter();
out.println("<html><body>");
out.println("Comments:");
for (String comment : comments) {
out.println("<div>" + comment + "</div>");
}
out.println("</body></html>");
}
}
模拟攻击的 Python 代码
import requests
# 构造包含存储型XSS脚本的评论内容
malicious_comment = "<script>alert('Stored XSS')</script>"
# 模拟发送包含恶意评论的POST请求到后端
data = {'comment': malicious_comment}
response = requests.post('http://yourserver/submit-comment', data=data)
print(response.text)
DOM-based XSS
前端部分(Vue3 + TS)
<template>
<input type="text" v-model="hashValue" @input="updateHash" />
<div id="content"></div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
name: 'DOMBasedXSSComponent',
data() {
return {
hashValue: ''
};
},
methods: {
updateHash() {
// 这里通过修改URL的哈希值来模拟DOM-based XSS漏洞
// 当用户输入内容时,会将输入作为哈希值设置到URL中,并根据哈希值来更新页面内容
// 假设根据哈希值会动态加载并执行一些脚本,但这里没有对哈希值进行安全处理
window.location.hash = this.hashValue;
let contentDiv = document.getElementById('content');
if (contentDiv) {
contentDiv.innerHTML = `You entered: ${this.hashValue}`;
}
}
}
});
</script>
后端部分(Java)
对于 DOM-based XSS,漏洞主要存在于前端对 DOM 的操作上,后端代码通常与普通的页面请求处理类似,这里给出一个简单的示例,用于返回包含前端代码的页面:
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
@WebServlet("/dom-based-xss-page")
public class DOMBasedXSSEXampleServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException {
PrintWriter out = response.getWriter();
out.println("<html><body>");
out.println("<input type='text' id='hashInput' oninput='updateHash()' />");
out.println("<div id='content'></div>");
out.println("<script>");
out.println("function updateHash() {");
out.println(" var hashValue = document.getElementById('hashInput').value;");
out.println(" window.location.hash = hashValue;");
out.println(" var contentDiv = document.getElementById('content');");
out.println(" if (contentDiv) {");
out.println(" contentDiv.innerHTML = 'You entered: ' + hashValue;");
out.println(" }");
out.println("}");
out.println("</script>");
out.println("</body></html>");
}
}
模拟攻击的 Python 代码
import requests
# 构造包含DOM-based XSS脚本的哈希值内容
malicious_hash_value = "#<script>alert('DOM-based XSS')</script>"
# 模拟发送包含恶意哈希值的GET请求到后端(这里主要是触发前端的漏洞,实际攻击场景可能更复杂)
url = 'http://yourserver/dom-based-xss-page' + malicious_hash_value
response = requests.get(url)
print(response.text)
请注意,上述代码只是为了演示三种 XSS 攻击类型相关的原理和问题,在实际的生产环境中,需要更全面和深入的安全措施来防止这些攻击的发生。
标签:脚本,XSS,跨站,println,import,servlet,response,out From: https://blog.csdn.net/m0_57836225/article/details/143693682