如何防止xss攻击

所谓xss，全称Cross Site Scripting，翻译过来就是"跨站脚本攻击"，按照惯例，我们该称之为CSS,但是css不是有了么，为了不和层叠样式表(英文名Cascading Style Sheets, CSS)的缩写混淆，才将跨站脚本攻击缩写为XSS，XSS是一种在web应用中的程序安全漏洞，它允许恶意web用户将代码植入到提供给其它用户使用的页面中。

        至今为止，你可能依然不知道xss攻击到底是啥。举个简单例子：

        论坛都玩过吧，如果你在发表帖子的时候输入"<script>alert(1)</script>",如果论坛没有做任何处理，那么你评论的内容将会在当前页面弹出一个对话框，这点大家都知道吧，要知道你在看的页面别人也在看啊，打开页面就弹出个对话框，谁还来这玩？大家如果都这样恶搞，那这个论坛还是趁早关门大吉吧。这种在网页中输入脚本影响了用户的正常浏览的行为就叫xss攻击。

        更有甚者，居心叵测者大有人在，xss攻击脚本更不仅仅是弹出一个对话框，但是如果你的网站连基本的xss攻击都无法防范，更妄谈其他了。

 

        介绍完了基本概念，我们来看一下，如何书写一个简单的（当然了，也非常有效）防范xss攻击的程序，这里用js来实现。

var inputVal=$('#topic_container').val();			
var reg=/<\s*[^>]+>[\s\S]*<\s*[^>]+>/gim;
var matchArr;
var finalStr='';
while((matchArr=reg.exec(inputVal))!=null){
	finalStr=inputVal.replace(/</gim,'&lt;');
	finalStr=finalStr.replace(/>/gim,'&gt;');
}
if(finalStr){
	inputVal=finalStr;
}
console.log(inputVal);

其中#topic_container为textarea的id，inputVal为用户输入的值，这段程序的思路就是，替换<为"&lt;",替换>为"&gt;"。经过这层转义之后，如果你需要在网页上显示，浏览器就会将html实体字符再转化过来，达到了用户输入什么就展示什么的同时，也不会去执行恶意的脚本代码的目的。

比如用户输入的是

<script>
    alert(1);
</script>

那么经过转化后就是

<script>
    alert(1);
</script>

浏览器显示的时候依然是

<script>
    alert(1);
</script>