今天其他项目组同事过来问过我是否遇到过这种情况?
场景:在项目input框中输入含有script标签包含的脚本,提交后却意外的被执行了。(所有恶意攻击的脚本标签)
问题:HTML没有进行转义的发送,会导致回显或者提交的时候html语义无法解释 < 和 > 符号,认为其是标签。故进行标签模式的渲染。
解决:每次发送前对输入的字符串进行特殊符号的转义,避免html标签符号和特殊符号给解释器造成冲突。从而导致XSS的恶意脚本攻击。
下面附上防止js脚本注入的源码:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <textarea id="textarea" style="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>
使用方式:
1、将XSS攻击的脚本语言输入到textarea文本域中,点击获取会弹出其转义后的字符串。
2、点击赋值会将转移后的字符串赋值给textarea文本域的value。从而html解释器解释特殊字符,并显示出用户想要显示的特殊语义。
有问题欢迎广大代码爱好者交流,互相学习。