XSS攻击，又称为CSS（Cross Site Scripting），由于CSS已经被用作层叠样式表，为了避免这个冲突，我们将Cross缩写成X，中文名叫做跨站脚本攻击。其中需要注意的是跨站，简单的说，一个网站运行的逻辑都应该来自于本站，也就是说，是我们自己网站的东西才能在网站上运行，那么如果我们的网站中运行了其他网站的东西，此时我们就称为跨站脚本工具。
XSS攻击根据攻击代码的来源可以分为反射型和存储型。其中，反射型表示攻击代码直接通过url传入，而存储型攻击表示攻击代码会被存储到数据库中，当用户访问该记录时才被读取并显示到页面中。目前，攻击者主要采用存储型攻击方式。
XSS攻击的原理就是利用javascript脚本替换原本应该是数据的内容来达到攻击的效果。譬如：
<pre style="margin: 8px 0px; color: rgb(0, 0, 0); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); font-size: 0.8rem;"><%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
</head>
<body>
<input type="text" id="content"/>
<button onclick="submit()">提交</button>
<script type="text/javascript">
function submit() {
var content = document.getElementById("content").value;
document.write(content);
}
</script>
</body>
</html></pre>
image.png
接着在输入框中输入：
<script>alert('game over');</script>
出现弹出框
image.png
危害
看到这里，我们可能会想，弹一个框影响不大。但是，攻击者通过script脚本，获取cookie信息，那么攻击者就可以假冒你的身份做事情了。除此之外，攻击者还可以通过脚本劫持前端逻辑实现用户意想不到的页面跳转。
攻击的预防
- 对于XSS攻击最好的防范手段是：转义。对于用户提交的数据，在展示前，不管是客户端还是服务端，只要有一个段做了转义，就能避免。
<pre style="margin: 8px 0px; color: rgb(0, 0, 0); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); font-size: 0.8rem;"><%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
</head>
<body>
<input type="text" id="content"/>
<button onclick="submit()">提交</button>
<script type="text/javascript">
function escape(c) {
return c.replace(/&/g, '&')
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/"/g, '"');
}
function submit() {
var content = escape(document.getElementById("content").value);
document.write(content);
}
</script>
</body>
</html></pre>
增加Cookie被劫持的难度：HttpOnly
- 给cookie加上HttpOnly，防止被javascript访问到。
Set-Cookie: <name>=<value>[; <Max-Age>=<age>]
[; expires=<date>][; domain=<domain_name>]
[; path=<some_path>][; secure][; HttpOnly]
- HTTP协议层次：如果黑客在Socket层面获取cookie还是无法限制的
