思路：
        去掉所有跟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. 关于tf.cond函数中“正确”与“错误”函数中的普通python语句始终执行的问题

    import tensorflow as tf import numpy as np x = tf.constant(2) y = tf.constant(3) global mask0 mask0 ...

  2. 打造静态分析器（二）基于Asp.Net Core 3.0的AspectCore组件检测

    上一篇,我们打造了一个简单的分析器,但是我们实际使用分析器就是为了对项目做分析检测,增加一些非语法的自检的 比如Asp.Net Core 3.0的替换依赖注入检测 设计分析 我们创建一个默认的Asp. ...

  3. 【BalticOI2003】Gem 题解（树形DP）

    题目大意: 给树上每一个结点赋值(值为正整数),要求相邻结点的权值不能相同.问树上最小权值和.$n\leq 10000$. ------------------------- 设$f[i][j]$表示 ...

  4. Python生成测试数据-Faker(非LOL选手-李相赫)

    Faker介绍 官方文档:https://faker.readthedocs.io/en/master/ Faker is a Python package that generates fake d ...

  5. 使用QT实现一个简单的登陆对话框（纯代码实现C++）

    使用QT实现一个简单的登陆对话框(纯代码实现C++) 效果展示 使用的QT控件 控件 描述 QLable 标签 QLineEdit 行文本框 QPushButton 按扭 QHBoxLayout 水平 ...

  6. JS DOM重点核心笔记

    DOM重点核心     文档对象模型,是W3C推荐的处理可扩展的标记语言的标准编程接口     我们主要针对与勇士的操作,主要有创建.增加.删除.修改.查询.属性操作.事件操作   三种动态创建元素的 ...

  7. JS中splice方法的使用

    在js中,arr.splice(str)方法是处理数组的利器,利用它可以实现在指定位置删除.替换.插入指定数量的元素. 其语法为:  arr.splice(index[, deleteCount, e ...

  8. 使用DockerFile构建运行GoWeb

    安装docker # 安装一些必要的系统工具 sudo yum install -y yum-utils device-mapper-persistent-data lvm2 # 添加软件源信息 # ...

  9. 密码学系列——消息摘要（c#代码实操）

    前言 简介: 消息摘要(Message Digest)又称为数字摘要(Digital Digest) 它是一个唯一对应一个消息或文本的固定长度的值,它由一个单向Hash加密函数对消息进行作用而产生 使 ...

  10. Android开发进程0.1 轮播图 Scrollview Fragment

    轮播图的实现 轮播图通过banner可以较为便捷的实现 1.添加本地依赖,在dependence中搜索相关依赖 2.添加banner的view组件 3.创建适配器GlideImageLoader ex ...