版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/wangxinxin1992816/article/details/85251837
前端给后台传json格式参数,输入字段向后台传参时前端要做防止注入。
html转义是将特殊字符或html标签转换为与之对应的字符。如:< 会转义为 <> 或转义为 >像“<script>alert('test');</script>”这段字符会转义为:“<script>alert('test');</script>”再显示时页面会将<解析为<,>解析为>,从而还原了用户的真实输入,最终显示在页面上 的还是“<script>alert('test');</script>”,即避免了js注入攻击又真实的显示了用户输入。
demo如下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<textarea id="textarea" style="width:300px;height:100px;"></textarea>
<button id="getValue" onclick="getVal()">获取</button>
<button id="setValue" onclick="setVal()">赋值</button>
</body>
<script>
var $ = document.getElementById('textarea');
var _val = '';
function getVal(){
_val = htmlEncode ($.value);
alert(_val);
$.value = '';
}
function setVal(){
$.value = htmlDecode (_val);
}
//转义 元素的innerHTML内容即为转义后的字符
function htmlEncode (str) {
var ele = document.createElement('span');
ele.appendChild( document.createTextNode( str ) );
return ele.innerHTML;
}
//解析
function htmlDecode (str) {
var ele = document.createElement('span');
ele.innerHTML = str;
return ele.textContent;
}
</script>
</html>