直接看图看代码吧！直观明了！
json.jsp页面
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%
//<script type="text/javascript" src="${pageContext.request.contextPath}/js/toTop.js"></script>
System.out.println("项目路径=" + request.getContextPath());
String projectPath = request.getContextPath();
String toTop = "<script type=\"text/javascript\" src=\"" + projectPath + "/js/toTop.js\"></script>";
request.setAttribute("toTop", toTop);
%>
<!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>在json的数据中插入恶意代码</title>
<link rel="stylesheet" type="text/css"
href="${pageContext.request.contextPath}/css/body.css">
<link rel="stylesheet" type="text/css"
href="${pageContext.request.contextPath}/css/mark.css">
<link rel="stylesheet" type="text/css"
href="${pageContext.request.contextPath}/css/console.css">
<script type="text/javascript"
src="${pageContext.request.contextPath}/js/console.js"></script>
${requestScope.toTop}
<script type="text/javascript" src="${pageContext.request.contextPath}/js/weChatQRCode.js"></script>
</head>
<body>
<center>
<h1>在json的数据中插入恶意代码(打开浏览器的控制台进行测试和查看，console.log())</h1>
eval()函数不太安全，比如：eval()函数解析文本框(input)中输入的非法的值(用户在文本框中输入了某些恶意的非法的javascript代码)<br>
<a target="_blank" href="https://blog.csdn.net/czh500/article/details/80469630">
解析Json的两种方法详解
</a>
<a target="_blank" href="https://blog.csdn.net/aitangyong/article/details/40817587">
全局变量和局部变量参考文章1
</a>
<a target="_blank" href="https://blog.csdn.net/xiankechuanqi/article/details/52467772">
全局变量和局部变量参考文章2
</a> <br><br>
<input type="button" value="显示body标签中的内容" οnclick="showBody()">
<input type="button" value="demo1测试全局变量和局部变量" οnclick="testVar(this)">
<input type="button" value="javaScript全局变量和局部变量demo2" οnclick="testVar2()">
<input type="button" value="demo3全局变量和局部变量" οnclick="testVar3()"><br><br>
<input type="button" value="测试语句块" οnclick="testSentenceBlock()">
<input type="button" value="测试javascript转义字符" οnclick="zhuanyi()">
<input type="button" value="测试eval函数和JSON.parse()函数的区别" οnclick="testEvalAndParse()">
<input type="button" value="使用eval函数处理数组对象" οnclick="evalArray()"><br><br>
<input type="button" value="测试json对象和json数组(数组具有length,对象不具有length)" οnclick="testJsonObject()">
<input type="button" value="测试json的length长度" οnclick="testJsonLength()"><br><br>
<a href="https://www.cnblogs.com/eason1999/p/5527413.html" target="_blank">JSON.parse和eval的区别</a>
<input type="button" value="JSON.parse和eval的区别" οnclick="json_parse_eval()"><br><br>
<a href="https://www.cnblogs.com/heshan1992/p/5685998.html" target="_blank">
js中eval()方法的使用以及一些特殊的使用方式
</a>
<input type="button" value="测试eval()函数的一些特殊用法" οnclick="testEvalFunction()"><br><br>
<div id="showJsonData" class="testDiv3" style="height: auto;"></div><br>
数字1：<input id="number1" type="text"><br>
<br> 数字2：<input id="number2" type="text" readonly="readonly"><br>
<br> 数字3：<input id="number3" type="text"><br>
<br> 数字4：<input id="number4" type="text"><br>
<br> 数字5：<input id="number5" type="text"><br>
<br> <input type="button" οnclick="testJson()"
value="测试在文本框中输入恶意代码，eval函数解析json，看是否会执行恶意代码">
<hr>
<h1>json</h1>
<h2>员工信息表(测试：用户在文本框中输入恶意代码)</h2>
编号(id)：<input id="empId" type="text"><br><br>
姓名：<input id="empName" type="text"><br><br>
年龄：<input id="empAge" type="text" readonly="readonly"><br><br>
税后收入：<input id="empMoney" type="text"><br><br>
工龄：<input id="empWorkAge" type="text"><br><br>
备注：<input id="empRemarks" type="text" style="height: 80px; width: 80%"><br><br>
<input type="button" value="测试：用户在文本框中输入恶意代码" οnclick="testEmployeeJson()">
</center>
<br><br>
</body>
<script type="text/javascript">
window.onload = function() {
createFollowWeChatQRCodeElement();
var inputNode = document.getElementById("number2");
// var numberStr2 = '(function(){ location.href = "http://www.baidu.com"; })()';
// var numberStr2 = "(function(){ alert('how are you'); })()";
var numberStr2 = 'alert("workCity in shenzhen")';
// var numberStr2 = "alert('okokok')";
inputNode.value = numberStr2;
//注意：是readOnly，不是readonly，是大写的
if(inputNode.readOnly){
inputNode.style.backgroundColor = "#C2C2C2";
}
document.getElementById("number1").value = "tom";
document.getElementById("number3").value = "jack";
document.getElementById("number4").value = "66";
document.getElementById("number5").value = "8899";
//
// var empRemark = '(function(){for (var i = 0; i < 3; i++) {alert("第" + ++i + "次弹出");}})()';
// var empAgeStr = 'alert("work hard make money ")';
var empAgeStr = '(function(){ location.href = "http://www.baidu.com"; })()';
var empAge_inputNode = document.getElementById("empAge");
empAge_inputNode.value = empAgeStr;
if (empAge_inputNode.readOnly) {
empAge_inputNode.style.backgroundColor = "#C2C2C2";
}
document.getElementById("empId").value = "1689";
document.getElementById("empName").value = "令狐冲";
document.getElementById("empMoney").value = "28690.55";
document.getElementById("empWorkAge").value = "2";
var empRemarksStr = "我老家在江西省赣州市于都县渡江大道XX号,你们去改变世界,我只想认真赚钱";
document.getElementById("empRemarks").value = empRemarksStr;
}
function testJson() {
var number1 = document.getElementById("number1").value;
var number2 = document.getElementById("number2").value;
var number3 = document.getElementById("number3").value;
var number4 = document.getElementById("number4").value;
var number5 = document.getElementById("number5").value;
// var jsonData = ["'" + number1 + "'", number2, "'" + number3 + "'", "'" + number4 + "'", "'" + number5 + "'"];
// var jsonData = ["{'" + number1 + "'}", number2, "{'" + number3 + "'}", "{'" + number4 + "'}", "{'" + number5 + "'}"];
// var jsonData = "{'" + number1 + "'}," + number2 + ",{'" + number3 + "'}," + "{'" + number4 + "'}," + "{'" + number5 + "'}";
// var jsonData = "{'" + number1 + "'}," + "{" + number2 + "}" + ",{'" + number3 + "'}," + "{'" + number4 + "'}," + "{'" + number5 + "'}";
// var jsonData = "{'name':" + "'" + number1 + "'" + ",'age':" + number2 + ",'hobby':" + "'" + number3 + "'" + ",'sex':" + "'" + number4 + "'"+ ",'money':" + "'" + number5 + "'}";
// var jsonData = {'name': number1, 'age': number2, 'hobby': number3, 'sex': number4, 'money': number5};
var jsonData = { "name":number1, "age":number2, "hobby":number3, "sex":number4, "money":number5 };
alert("jsonData=" + jsonData);
// document.getElementById("showJsonData").innerHTML = JSON.stringify(jsonData);
// eval("(" + jsonData + ")");
eval(jsonData);
// var aa = "ok";
// var bb = "hi";
// var arrays = [ aa, bb ];
// alert("(" + arrays + ")");
// // eval("(" + arrays + ")");
// eval("(" + "['ok'," + "'hi']" + ")");
// eval("(" + "[\"gogo\"," + "\"toto\"]" + ")");
// // eval("(" + "[object Object]" + ")");
// // eval("(" + "[test1 test2]" + ")");
var test = {
"pageCount" : 7,
"count" : alert("hello javaScript!"),
"nowPage" : 23
};//单独的这行代码，会打印出hello javaScript!
// var test = { "pageCount":7, "count":hello,"nowPage":23 };//单独的这行代码，会打印出hello javaScript!
// var test = { "pageCount":7, "count":'hello',"nowPage":23 };//单独的这行代码，会打印出hello javaScript!
// var test = { "pageCount":7, "count":alert('hello,look'),"nowPage":23 };//单独的这行代码，会打印出hello javaScript!
// var test = { "pageCount":7, "count":alert("hello,gogogo"),"nowPage":23 };//单独的这行代码，会打印出hello javaScript!
// document.getElementById("showJsonData").innerHTML += "<br>" + JSON.stringify(test);
// debug("test数据=" + test);
// debug("(" + test + ")");
// var jsonData = '["' + number1 + '",' + number2 + ',"' + number3 + '","' + number4 + '","' + number5 + '"]';
debug("json数据=" + jsonData);
debug("(" + jsonData + ")");
//使用eval函数解析json数据时，json数据中的function函数会执行
// eval("(" + jsonData + ")");
// var jsonObj = eval("(" + jsonData + ")");
// for (var index = 0; index < jsonObj.length; index++) {
// debug(jsonObj[index]);
// }
// eval(jsonData);
// var jsonData2 = eval(jsonData);
// for (var index = 0; index < jsonData.length; index++) {
// debug(jsonData[index]);
// }
// var tests = eval([ 12, 968.57, 'jack', "努力赚钱" ]);
// for (var index = 0; index < tests.length; index++) {
// debug(tests[index]);
// }
}
//测试用户在文本框中输入恶意代码，构建一个员工对象的json信息进行测试
function testEmployeeJson() {
//构建一个员工对象的json数据
var employee_json = '{' + '"empId" :'
+ document.getElementById("empId").value + ',' + '"empName" :'
+ '"' + document.getElementById("empName").value + '",'
+ '"empAge" :' + document.getElementById("empAge").value + ','
+ '"empMoney" :' + document.getElementById("empMoney").value
+ ',' + '"empWorkAge" :'
+ document.getElementById("empWorkAge").value + ','
+ '"empRemarks" :' + '"'
+ document.getElementById("empRemarks").value + '"}';
console.log(employee_json);
var obj = eval("(" + employee_json + ")");//在解析json的时候，会执行json中的javascript语句
// var obj = JSON.parse(employee_json);//会报错
//var obj = eval(employee_json);//这种写法会报错，必须在两边加上小括号,如eval("(" + employee_json + ")");
console.log(obj);
debug(obj.empId + " / " + obj.empName + " / " + obj.empAge + " / "
+ obj.empMoney + " / " + obj.empWorkAge + " / "
+ obj.empRemarks);
debug(empId.value + " / " + empName.value + " / " + empAge.value
+ " / " + empMoney.value + " / " + empWorkAge.value + " / "
+ empRemarks.value);
}
//使用eval函数处理数组对象
function evalArray() {
//定义数组
//第1种
var cars1 = [ "aodi", "宝马", "布加迪" ];
// 第2种
var cars2 = new Array("jiebao", "奔驰", "路虎");
// var result1 = eval(cars1);
// var result2 = eval(cars2);
// document.getElementById("showJsonData").innerHTML = result1 + "<br>" + result2;
var result1 = eval("(" + cars1 + ")");
var result2 = eval("(" + cars2 + ")");
document.getElementById("showJsonData").innerHTML = result1 + "<br>"
+ result2;
}
//测试语句块
function testSentenceBlock() {
var number2 = document.getElementById("number2").value;
var number1 = document.getElementById("number1").value;
alert("number1=" + number1);
alert("number2=" + number2);//打印出alert("my message")这句话
var test1 = {
"name" : number1,
"message" : alert("江西省赣州市于都县")
};//单独的这行代码，会自动打印出江西省赣州市于都县
var test2 = {
"name" : number1,
"message" : number2
};//单独的这行代码，不会自动打印my message
eval(test1);//使用eval()函数解析test1这个json对象的时候不会打印出江西省赣州市于都县
eval(test2);//使用eval()函数解析test2这个json对象的时候不会打印出my message
var test3 = '{ "name":number1, "message":alert("于都县是长征出发地!")}';//单独的这行代码，不会自动打印出于都县是长征出发地!
eval("(" + test3 + ")");//使用eval()函数解析test3这个json字符串的时候，会打印出于都县是长征出发地!
alert("test1=" + test1.message);//打印出undefined
alert("test2=" + test2.message);//打印出alert("my message")
}
//测试eval函数和JSON.parse()函数的区别
function testEvalAndParse() {
var number1 = document.getElementById("number1").value;
var number3 = document.getElementById("number3").value;
var testJson1 = '{ "name":"' + number1
+ '", "message":alert("我老家在江西省赣州市于都县!")}';
var jsonObject1 = eval('(' + testJson1 + ')');
alert("jsonObject1=" + jsonObject1.name + " / " + jsonObject1.message);
var testJson2 = '{ "name":number3, "message":alert("在你的存款还没有500万之前，你所有的理想跟爱好都应该是赚钱!")}';
var jsonObject2 = eval('(' + testJson2 + ')');
alert("jsonObject2=" + jsonObject2.name + " / " + jsonObject2.message);
// var testJson3 = '{ "name":"' + number1 + '", "message":' + 'alert(\\"只要你有本事有能力，谁都不敢欺负你,否则，谁都敢欺负你!\\")}';
var testJson3 = '{ "name":"' + number1 + '", "message":'
+ '"alert(\\"只要你有本事有能力，谁都不敢欺负你,否则，谁都敢欺负你!\\")"}';
// var testJson3 = '{ "name":"' + number1 + '", "message":' + '"alert(\"只要你有本事有能力，谁都不敢欺负你,否则，谁都敢欺负你!\")"}';
alert("testJson3=" + testJson3);
console.log("testJson3=" + testJson3);
// var testJson3 = '{ "name":"' + number1 + '", "message":' + '"alert(\"只要你有本事有能力，谁都不敢欺负你,否则，谁都敢欺负你!\")"}';
var jsonObject3 = JSON.parse(testJson3);
alert("jsonObject3=" + jsonObject3.name + " / " + jsonObject3.message);
console.log("jsonObject3=" + jsonObject3.name + " / "
+ jsonObject3.message);
var testStr1 = '{"age":12, "workAge":3}';
var jsonObj1 = JSON.parse(testStr1);
alert(jsonObj1.age + " / " + jsonObj1.workAge);
var testStr2 = '{"onlineName":"jerry", "city":"shenzhen"}';
/*
JSON.parse(json)函数相对来说语法更严格一些,最好是属性名和属性值都加上引号，以免解析出错(最好是像下面这样写)
如下：
var jsonData1 = '{ "bookName":"西游记", "age":"16", "money":"32.65" }'//规范的写法是属性名和属性值左右两边都加上双引号
下面这种写法，JSON.parse(jsonData1);在解析的时候会报错，所以，最规范的是上面的那一种写法，在属性名和属性值左右两
边都加上双引号，最好别用单引号!
//在属性名和属性值左右两边都加上单引号，JSON.parse()函数在解析的时候会出错
var jsonData1 = "{ 'bookName':'三国演义', 'age':'23', 'money':'68.99' }"
*/
// var jsonData1 = "{ 'bookName':'三国演义', 'age':'23', 'money':'68.99' }"//规范的写法是属性名和属性值左右两边都加上双引号，最好别用单引号
var jsonData1 = '{ "bookName":"西游记", "age":"16", "money":"32.65" }'
var json = JSON.parse(jsonData1);
alert("jsonData1=" + json.bookName + " / " + json.age + " / "
+ json.money);
var jsonObj2 = JSON.parse(testStr2);
alert(jsonObj2.onlineName + " / " + jsonObj2.city);
}
//测试转义字符
function zhuanyi() {
// var testMyjson = '{ "name":"gogogo", "message":"alert(\\"努力工作赚钱!\\")" }';
// console.log(testMyjson);
// var myJson = eval('(' + testMyjson + ')');
// console.log(myJson.name + " / " + myJson.message);
var str1 = "\"";
alert("str1=" + str1);
var str2 = '"alert(\"只要你有本事有能力，谁都不敢欺负你,否则，谁都敢欺负你!\")"';
alert("str2=" + str2);
var str3 = '"alert(\\"在你的存款还没有500万之前，你所有的理想跟爱好都应该是赚钱!\\")"';
alert("str3=" + str3);
var str4 = '"alert("你必须非常努力，才能看起来毫不费力!")"';
alert("str4=" + str4);
var str5 = '\""';
alert("str5=" + str5);
var str6 = '""';
alert("str6=" + str6);
var str7 = '\"\"';
alert("str7=" + str7);
var str8 = '\\';
alert("str8=" + str8);
var str9 = '\\\\';
alert("str9=" + str9);
var str10 = '\'';
alert("str10=" + str10);
}
//测试javaScript中的全局变量和局部变量
function testVar(obj) {
/*
本方法中的this指的是window对象，因为testVar(obj)方法,默认是window对象的方法，所
以调用testVar(obj)函数，本质上是window.testVar();谁调用testVar()函数，那本方
法中的this就代表谁，很明显，this代表的就是window对象
注意：如果调用testVar()方法的时候，是testVar(this)这样调用的,那么这个this就
是指那个调用testVar(this)方法的控件
*/
console.log("this=" + this); //打印this=[object Window]
console.log("obj=" + obj + " / " + obj.value);
//没有用var，其实是定义了一个全局变量，会放在window对象中。
//没有使用var关键字定义的变量是全局变量
hobby = "走路";
//全局变量会存放在window对象中
console.log("hobby=" + hobby + " / " + window.hobby + " / "
+ this.hobby);
var test1 = "3days";
console.log("test1=" + test1 + " / " + window.test1 + " / "
+ this.test1);
test1 = "5Weeks";
console.log("test1=" + test1 + " / " + window.test1 + " / "
+ this.test1);
var a;
console.log("a=" + a);
a = 55;
console.log("a=" + a + " / " + this.a + " / " + window.a);
b = "江西省赣州市于都县";
console.log("b=" + b + " / " + this.b + " / " + window.b);
//使用var定义变量，变量声明会被提前，但是赋值不会提前
var b = "我老家在江西省赣州市于都县渡江大道XX号";
console.log("b=" + b + " / " + this.b + " / " + window.b);
}
// window.testVar(this);
//定义全局变量
var x = "我是全局变量";
//测试javaScript中的全局变量和局部变量
function testVar2() {
console.log(x);
var x = "我是局部变量";
console.log(x + " / " + this.x + " / " + window.x);
}
//测试javaScript中的全局变量和局部变量
function testVar3() {
console.log(x);
x = "我是没用var关键字声明的变量x";
console.log(x + " / " + this.x + " / " + window.x);
}
//测试json对象和json数组
function testJsonObject() {
//用方括号[]的是数组，数组具有length
var jsonObject1 = [ {
"userName" : "囧囧",
"password" : "1234",
"age" : "6"
} ];
console.log("长度：" + jsonObject1.length);
//用{}的是对象，对象不具有length
var jsonObject2 = {
"userName" : "zhangsan",
"password" : "5678",
"money" : "18000.55"
};
console.log("长度：" + jsonObject2.length);
}
function showBody() {
console.log(document.body.innerHTML);
}
//测试json的length长度testJsonLength
function testJsonLength(){
var testMyStr = "you are";
console.log("length长度=" + testMyStr.length);
var jsonData1 = '{"message":"努力工作赚钱"}';
var jsonData2 = '{"info":"2018年已过半，如白驹过隙，我还没赚到1个亿"}';
var jsonData3 = {"title":"就算失败了，还是要不断努力奋斗"};
var jsonData4 = [{"hometown":"江西省赣州市于都县渡江大道XX6号"}];
console.log("jsonData1长度=" + jsonData1.length);
console.log("jsonData2长度=" + jsonData2.length);
console.log("jsonData3长度=" + jsonData3.length);
console.log("jsonData4长度=" + jsonData4.length);
var json1 = JSON.parse(jsonData1);
var json2 = JSON.parse(jsonData2);
var jsonObject1 = eval("(" + jsonData1 + ")");
var jsonObject2 = eval("(" + jsonData2 + ")");
console.log(jsonObject1.message);
console.log(jsonObject2.info);
//用JSON.parse()函数解析json,参数只能传json字符串，不能传json对象(JSON.parse()函数对json格式的语法要求比较严格)
// var json3 = JSON.parse(jsonData3);//报错，参数只能传json字符串，不能传json对象
// var json4 = JSON.parse(jsonData4);报错，参数只能传json字符串，不能传json对象
console.log(json1.message);
console.log(json2.info);
// console.log(json3.title);
// console.log(json4.hometown);
}
//JSON.parse和eval的区别
function json_parse_eval() {
var value = 25;
var jsonstr = '{"info":"hello","number":++value}';
console.log("value=" + value);
var data1 = eval('(' + jsonstr + ')');
console.log("value=" + value);
console.log(data1.number + " / " + data1);//这时value值为26
console.log(data1);
// var data2 = JSON.parse(jsonstr);//报错
// console.log(data2);
}
//测试eval()函数的一些特殊用法
function testEvalFunction(){
var code1 = '"a" + 2'; //表达式
var code2 = '{a:2}'; //语句
console.log(eval(code1)); //->a2
console.log(eval(code2)); //->2
console.log(eval('(' + code2 + ')')); //-> Object { a=2 }
}
</script>
</html>
1064
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
