HTML转义及防止JavaScript注入攻击

正文：

有时候网页中会有一个输入框，用户输入内容后会显示在页面中，类似于网页聊天应用。如果用户输入了一段 js脚本，比如：< script>alert(‘test’);< /script>，页面会弹出一个对话框，或者输入的脚本中有改变页面 js变量的代码，则会导致程序异常或者绕过某种验证。那么如何防止这种恶意的 js 脚本攻击呢？可以通过html转义来解决这个问题。

一：什么是 html 转义？

二：如何转义？

1、通过 js 实现

//转义  元素的 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;
}

2、通过jquery实现

/*对 html 标签进行转义*/
        function htmlEncode(value){   //value 为输入的值
            return $('<span/>').text(value).html();     //.这里的 span 标签没啥含义，换着其他标签也可以，div，p a 都行
        }
         /*对 html 标签进行反转义*/
        function htmlDecode(value){  
            return $('<span/>').html(value).text();     
        }

转载请注明：汇站网 » HTML 转义及防止 JavaScript 注入攻击