有学有练才叫学习:学而不思则罔,思而不学则殆:学而不习,纸上谈兵,习而不进,画地为牢!

防止XSS攻击,前端js实现字符转义和反转义

javascript cat 3个月前 (07-17) 47次浏览 已收录 0个评论 扫描二维码

XSS攻击又称为跨站脚本,XSS的重点不在于跨站点,而是在于脚本的执行。XSS是一种经常出现在Web应用程序中的计算机安全漏洞,是由于Web应用程序对用户的输入过滤不足而产生的,它允许恶意web用户将代码植入到提供给其它用户使用的页面中。

举个栗子: 在数据库中写入一段代码<script>alert(1)</script>,然后前端通过请求等方式获取到这段代码在页面中渲染,访问页面时就会被执行,浏览器就会弹出1的弹窗,这就最简单的XSS攻击

怎么避免XSS?

前端处理: 使用字符转义,将’<‘、’>'等字符进行转义&lt;&gt;

后端处理: 也是一样的道理,将相关的字符给转义,就可以避免XSS

字符转义(解决XSS)

直接调用下面的htmlEscape(‘’)方法,就可以过滤掉存在XSS风险的相关字符:

function htmlEscape(str) { //字符转义
var escapesMap = {
'<': '&lt;',
'>': '&gt;',
'"': '&quot;',
"'": '&#039;'
},
reUnescapedHtml = new RegExp(/[<>"']/g);
return (str && reUnescapedHtml.test(str)) ? str.replace(reUnescapedHtml, function(chr) {
return escapesMap[chr];
}) : (str || "");
}

字符反转义

有时候在写逻辑的时候,可能需要反转义,就用下面的htmlUnEscape方法:

function htmlUnEscape(str) { //反转义
var unescapes = {
'&amp;': '&',
'&lt;': '<',
'&gt;': '>',
'&quot;': '"',
'&#39;': "'"
},
reEscapedHtml = new RegExp(/&(?:amp|lt|gt|quot|#39);/g);
return (str && reEscapedHtml.test(str)) ? str.replace(reEscapedHtml, function(entity) {
return unescapes[entity];
}) : (str || '')
}
喜欢 (0)
cat
关于作者:
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址