xss跨站点脚本攻击

总之这是今天的笔记

什么是xss跨站点脚本攻击

XSS的原理和分类
跨站脚本攻击XSS(Cross Site Scripting),为了不和层叠样式表(Cascading Style Sheets, CSS)的缩写混淆,故将跨站脚本攻击缩写为XSS。恶意攻击者往Web页面里插入恶意Script代码,当用户浏览该页面时,嵌入Web里面的Script代码会被执行,从而达到恶意攻击用户的目的。XSS攻击针对的是用户层面的攻击!

1.什么是Javascript
JavaScript是指在网页上编写的脚本语言,是对HTML在功能上的扩展。
JavaScript与Java没有任何关系,它们只是名字相似而已。
JavaScript的代码嵌入在HTML里,直接在客户端的浏览器上执行,属于前端语言。
大多数的XSS代码都是使用JavaScript语言编写的,JavaScript能做到什么效果,XSS的威力就有多大。
JavaScript自测
https://www.w3school.com.cn/quiz/quiz.asp?quiz=js
JavaScript基础语法练习
搭建环境(WS2008+AppServ+Sublime)
例子1:JavaScript test

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>JavaScript test</title>
</head>
<body>
	<script>
	document.write("<h1>Hello,world")
	</script>
</body>
</html>

例子2:JavaScript 变量

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>JavaScript 变量</title>
</head>
<body>
	<script>
	var name = "shuke";
	document.write("<h1>hello,"+ name)
	</script>
</body>
</html>

例子3:JavaScript 字符串拼接

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>字符串拼接</title>
</head>
<body>
	<script>
	var name = "leiyu";
	var age = 17;
	document.write("<h1>Hello,everyone! My name is " + name +". I'm " + age +" years old.");
	</script>
</body>
</html>

例子4:JavaScript 事件响应

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>JavaScript 事件响应</title>
</head>
<body>
	<form action="">
		<input type="button" value="请单击此处" onclick=alert('你单击了此按钮,触发了弹窗') >
	</form>
</body>
</html>

例子5:JavaScript OnError事件

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>JavaScript OnError事件</title>
</head>
<body onload=alert("客官,您久等了....")>
	<img src="./images/welcome.png" onerror=alert("请检查图片路径....")>
</body>
</html>
加载外部js文件
jstest.html文件
<script src="/js/test.js"></script>
test.js文件
alert("hello,world!");

例子6:加载外部文件

<script src=“URL"></script>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>加载外部js文件</title>
</head>
<body>
	<script src="./js/test.js"></script>
</body>
</html>

例子7:加载外部文件document对象的常用属性:cookie,location

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>document对象的常用属性:cookie,location</title>
</head>
<body>
	<script>
	alert(document.cookie);
	alert(document.location);
</script>
</body>
</html>

例子8:location.href实现页面跳转

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>location.href实现页面跳转</title>
</head>
<body>
	<script>
		alert(document.location);
		location="http://www.51cto.com";
	</script>
</body>
</html>

例子9:Javascript语法-条件判断+函数

<!DOCTYPE html>

<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Javascript语法-条件判断+函数</title>
</head>
<body>
<script>
	function getGrade(score){
	if (score>=60){
	return "及格";
	}
	else{
	return "不及格";
	}
	}
document.write(getGrade(40));
</script>	
</body>
</html>

例子10:条件分支

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>根据分数给出等第</title>
</head>
<body>
	<script>
function getGrade(score)
{
	if(score>=90)
	{
	return "excellent";
}
else if(score>=80)
{
	return "good";
}
else if(score>=70){
	return "just so so";
}
else if(score>=60){
	return "pass";
}
else if{
	return "not good";
}
}
document.write(getGrade(70));
</script>
</body>
</html>