XSS前端防御
这篇文章是在挖掘xss漏洞时,自己总结来的,废话不多说,直接步入正题。我们在挖掘xss漏洞时,有时候会发现服务端并未对我们输入的任何特殊字符过滤、编码和转义,比如,
但是,
这种一般就是前端的杰作了!
下面总结前端对xss防御的几种手段:
使用replace函数
function htmlEncode(str) {
return str.replace(/[&<>"']/g, function(match) {
return {
'&': '&',
'<': '<',
'>': '>',
'"': '"',
"'": '''
}[match];
});
}
使用DOMPurify
import DOMPurify from 'dompurify';
const jsonData = {"kbId":"KBfc6b7778922f","kbName":"<u>hello</u>"};
const targetElement = document.getElementById('target-element');
targetElement.innerHTML = DOMPurify.sanitize(jsonData.kbName);
使用he
import he from 'he';
const jsonData = {"kbId":"KBfc6b7778922f","kbName":"<u>hello</u>"};
const targetElement = document.getElementById('target-element');
targetElement.innerHTML = he.encode(jsonData.kbName);
JS操作DOM
var kbName = "<u>sabercoco</u>";
var textNode = document.createTextNode(kbName);
var spanElement = document.createElement('span');
spanElement.appendChild(textNode);
var kbNameElement = document.getElementById("kbNameElement");
kbNameElement.innerHTML = '';
kbNameElement.appendChild(spanElement);
好了,以上就是文章的全部了,各位看官您慢走~