今天其他項目組同事過來問過我是否遇到過這種情況？
場景：在項目input框中輸入含有script標簽包含的腳本，提交后卻意外的被執行了。（所有惡意攻擊的腳本標簽）
問題：HTML沒有進行轉義的發送，會導致回顯或者提交的時候html語義無法解釋 < 和 > 符號，認為其是標簽。故進行標簽模式的渲染。
解決：每次發送前對輸入的字符串進行特殊符號的轉義，避免html標簽符號和特殊符號給解釋器造成沖突。從而導致XSS的惡意腳本攻擊。
下面附上防止js腳本注入的源碼：
<!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>
使用方式：
1、將XSS攻擊的腳本語言輸入到textarea文本域中，點擊獲取會彈出其轉義后的字符串。
2、點擊賦值會將轉移后的字符串賦值給textarea文本域的value。從而html解釋器解釋特殊字符，並顯示出用戶想要顯示的特殊語義。
有問題歡迎廣大代碼愛好者交流，互相學習。