思路：
        去掉所有跟sql有关的标签：

$(function () {

$(":input").change(function () {

// alert($(this).attr('id'));

　　　　removeHTML($(this).attr('id'));

　　})

})

function removeHTMLTag(str) {

str = str.replace(/<\/?[^>]*>/gi, ''); // 去除HTML tag

str = str.replace(/[ | ]*\n/gi, '\n'); // 去除行尾空白

// str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多余空行

str = str.replace(/&nbsp;/ig, '');// 去掉&nbsp;

str = str.replace(/alert/gi, '');// 去掉alert;

str = str.replace(/%3CSCRIPT/gi, '');// 去掉3CSCRIPT;

str = str.replace(/input/ig, '');// 去掉input;

str = str.replace(/iframe/ig, '');// 去掉iframe;

str = str.replace(/window/ig, '');// 去掉window;

str = str.replace(/link/ig, '');// 去掉link;

str = str.replace(/location/ig, '');// 去掉location;

str = str.replace(/JAVASCRIPT/ig, '');// 去掉JAVASCRIPT;

str = str.replace(/update/ig, '');// 去掉update;

str = str.replace(/insert/ig, '');// 去掉insert;

str = str.replace(/select/ig, '');// 去掉select;

str = str.replace(/[\[\]({!),:;?%<>"'}¨]/g, "");// 替换大部分英文标点

return str;

}

// 将传过来的参数去掉非法字符

function removeHTML(id) {

debugger;

var str = $("#" + id).val();

str = removeHTMLTag(str);

$("#" + id).val(str);

}

在使用ajax进行留言的时候,出现了一个问题.因为留言内容写完之后,通过ajax提交内容,同时使用js把留言的内容添加到页面上来.浏览留言的时候也是通过ajax请求,然后再显示的.这样,如果有人在留言里写入了js语句,这结语句都会被执行.解决办法就是对这些特殊字符进行转义再显示出来.如果在jsp中使用jstl标签,就很简单了.直接使用<c:out value=”${r.content}”/>这样就行了,会自动进行转义,其中省略了参数escapeXML=”true”,这是默认的.所以说在显示这些用户提交的内容的时候不要用el表达示,因为el不会自动进行转义,用c:out比较好.而如果也是通过ajax请求,然后再显示的,那就用下面的方法.其实也很简单.

  1: var html="<script>alert('asdfasdf')<\/script>";

  2: $("#content").text(html);

     那么会发生什么情况 解决办法很简单 就是把这些特殊字符进行转义也就是<变成<>变成> 使用jquery对字符进行转义就可以了

  <head>

   <script>

     var html="<script>alert('asdfasdf')<\/scipt>";

         html=$("#x").text(html).html();

        $("#content").append("<div>"+html+"</div>");

    </script>

  </head>

  <body>

     <span id="x" style="display:none"></span>

     <div  id="content"></div>

  </body>

前端防止xxs注入的更多相关文章

  1. 防止前端脚本JavaScript注入

    在使用ajax进行留言的时候,出现了一个问题.因为留言内容写完之后,通过ajax提交内容,同时使用js把留言的内容添加到页面上来.浏览留言的时候也是通过ajax请求,然后再显示的.这样,如果有人在留言 ...

  2. Web前端工程师成长之路——知识汇总

    一.何为Web前端工程师?          前端工程师,也叫Web前端开发工程师.他是随着web发展,细分出来的行业.Web前端开发工程师,主要职责是利用(X)HTML/CSS/JavaScript ...

  3. Meteor全栈开发平台 - 不仅仅是前端

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,博客地址为http://www.cnblogs.com/jasonnode/ .网站上有对应每一 ...

  4. Web前端工程师成长之路

    一.何为Web前端工程师?        前端工程师,也叫Web前端开发工程师.他是随着web发展,细分出来的行业.Web前端开发工程师,主要职责是利用(X)HTML/CSS/JavaScript/D ...

  5. 如何做好一位资深的web前端工程师

    Web前端开发工程师是一个很新的职业,在国内乃至国际上真正开始受到重视的时间不超过5年.Web前端开发是从网页制作演变而来的,名称上有很明 显的时代特征.在互联网的演化进程中,网页制作是Web 1.0 ...

  6. 如何成为一名优秀的web前端工程师（前端攻城师）？

    程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · 詹姆士 我所遇到的前端程序员分两种:第一种一直在问:如何学习前端?第二种总说:前端很简单,就那么一点东西. 我从没有听到有人问:如何做一名优秀. ...

  7. 如何成为一名优秀的web前端工程师（转给自己，共勉）

    来源:王子墨的博客 程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · 詹姆士 我所遇到的前端程序员分两种: 第一种一直在问:如何学习前端? 第二种总说:前端很简单,就那么一点东西. 我从没有听到 ...

  8. web前端开发工程师

    web前端开发工程师 百科名片 Web前端开发工程师是一个很新的职业,在国内乃至国际上真正开始受到重视的时间不超过5年.Web前端开发是从网页制作演变而来的,名称上有很明显的时代特征.在互联网的演化进 ...

  9. 如何成为一名优秀的web前端工程师

    我所遇到的前端程序员分两种: 第一种一直在问:如何学习前端? 第二种总说:前端很简单,就那么一点东西. 我从没有听到有人问:如何做一名优秀.甚至卓越的WEB前端工程师. 何为:前端工程师? 前端工程师 ...

随机推荐

  1. 什么是Cookie、Session、Token？

    原文:https://mp.weixin.qq.com/s/pWXhI_ppKhtOP-Xf_SpuDA 来源:后厂村码农 在了解这三个概念之前我们先要了解 HTTP 是无状态的Web服务器,什么是无 ...

  2. Windows环境编译Spark源码

    一.下载源码包 1. 下载地址有官网和github: http://spark.apache.org/downloads.html https://github.com/apache/spark Li ...

  3. AutoMapper 9.0的改造

    AutoMapper于2019.8.12升级9.0 从此不再支持静态的对象转换 自己琢磨了一下,写了一套扩展 官方链接如下 https://github.com/AutoMapper/AutoMapp ...

  4. 【转载】requests库的7个主要方法、13个关键字参数以及响应对象的5种属性

    Python爬虫常用模块:requests库的7个主要方法.13个关键字参数以及响应对象的5种属性 原文链接: https://zhuanlan.zhihu.com/p/67489739

  5. Java语言特性

    Java的语言特性: 1.语法相对简单 2.面向对象 3.分布性 4.可移植性 5.安全性 6.健壮性 7.解释性 8.多线程 9.动态性与并发性 Java中的面向对象编程: 面向对象程序设计(Obj ...

  6. 使用webgl(three.js)创建科技版3D机房，3D机房微模块详细介绍(升级版三)—— 1

    上节课已经详细描述了微模块机房的实现过程,文章地址(https://www.cnblogs.com/yeyunfei/p/10484241.html) 紧接着上节课的内容 我们这节可来详细讲解科技版机 ...

  7. 比原链(Bytom)正式开源Bytom-JavaScript库

    12月13日,比原链(Bytom)正式开源Bytom-JavaScript库,这个库是官方原生支持的新一代JavaScript SDK接口.JavaScript是世界上最多人使用的解释性脚本语言,JS ...

  8. 将vscode打造成强大的C/C++ IDE

    一.安装 你可以直接从微软官网下载,如果你想要一个纯净的vscode(微软官方的有一项商标.一个插件库.一个 C# 调试器以及遥测),可以手动编译https://github.com/microsof ...

  9. SpringBoot2 整合Ehcache组件，轻量级缓存管理

    本文源码:GitHub·点这里 || GitEE·点这里 一.Ehcache缓存简介 1.基础简介 EhCache是一个纯Java的进程内缓存框架,具有快速.上手简单等特点,是Hibernate中默认 ...

  10. 从一次外卖到对oauth2.0的思考

    别问oauth1.0哪去了,问就是不好讲. 1. 外卖并不好吃   今天下班得早,想吃顿好的,于是就点了一份外卖,过了一会儿,外卖到了,但是在小区大门被堵住了,我亲自远程开门后才能进来,又过了一会,被 ...