before

本篇博客展示了如何是在前端对铭感字符及一些特殊的命令做过滤。

好处是，少发一次请求，减少服器校验压力。

源码示例

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="x-ua-compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>JavaScript过滤敏感词</title>

</head>

<body>

<div>敏感字符或命令过滤，试试输入"rm -rf"或者"武藤老师"</div>

<input type="text" placeholder="请输入" class="p1">

<!-- 绑定事件 -->

<button onclick="foo()">测试</button>

<!-- 报错提示框 -->

<div class="p2"></div>

</body>

<!-- 首先引入 jQuery -->

<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>

<!-- 引入弹出框插件 -->

<script src="https://cdn.bootcss.com/sweetalert/2.0.6/sweetalert.min.js"></script>

<script>

    function testRe(doc) {

        // 需要维护的敏感词数组

        var tokens = ["rm -rf", "武藤老师"];

        var l = new Array();

        $.each(tokens, function (k, v) {

            l.push(new RegExp(v, "g"))

        });

        var result = '';  // 用于接收每次循环匹配的结果

        var result1 = '';  // 收集多个匹配结果，用于后续的展示等

        var new_doc = doc;  // 用于返回匹配后的新的字符串

        for (var i = 0; i < l.length; i++) {

            while ((result = l[i].exec(doc)) != null) {

                result1 += result + ' . ';  // 我这里是拼接为字符串，也可以替换为数组

                // 将匹配到结果替换到传过来的字符串

                var reg = new RegExp(result, 'g');

                new_doc = new_doc.replace(reg, '<b style="color:red;font-size:22px;">' + result + '</b>');

            }

        }

        // 根据需要返回内容

        return [new_doc, result1];

    }

    // 调用示例

    function foo() {

        // 找到输入框 获取要匹配的字符串

        var value = $(".p1").val();

        // 开始进行过滤

        var result = testRe(value);

        if (result[1].length > 0) {

            // 匹配到了敏感字符或者命令

            swal({

                title: "警告, 存在敏感命令或字符！",

                text: result[1],

                showConfirmButton: false

            });

            // 将敏感字符替换到原来的 div 中

            $(".p2").html(result[0])

        } else {

            // 正常的业务逻辑 可以自定制

            swal({

                title: "hi！",

                text: "不存在敏感命令或字符",

                // timer: 2000,

                showConfirmButton: true

            })

        }

    }

</script>

</html>

JavaScript - 过滤敏感字符的更多相关文章

  1. 采用Global.asax的Application_BeginRequest事件过滤敏感字符

    1.特殊字符过滤公共类ProcessRequest.cs using System.Web.UI; using System.Web.UI.WebControls; using System.Web. ...

  2. java web过滤器实际应用（解决中文乱码 html标签转义功能 敏感字符过滤功能）

    转载地址:http://www.cnblogs.com/xdp-gacl/p/3952405.html 在filter中可以得到代表用户请求和响应的request.response对象,因此在编程中可 ...

  3. js实现过滤重复字符和重复数组-javascript技巧

    js实现过滤重复字符 <script type="text/javascript"> <!-- String.prototype.noRepeatStr=func ...

  4. [转]Filter实现处理中文乱码,转义html标签,过滤敏感词

    原文地址:http://www.cnblogs.com/xdp-gacl/p/3952405.html 在filter中可以得到代表用户请求和响应的request.response对象,因此在编程中可 ...

  5. 利用微软AntiXss Library过滤输出字符，防止XSS攻击

    假如项目在前期没有过滤客户提交的字符,那么可以在输出的时候,对输出的字符进行过滤,防止出现XSS跨域攻击. 原理简单:利用ASP.NET API的管道原理,在MessageHandlers中添加一个自 ...

  6. Java过滤敏感词语/词汇---DFA算法

    最近网站需要在评论.投稿等地方过滤敏感词汇,于是在网上查找了相关教程,特此整理分享. 关于DFA算法,详细的可以去http://blog.csdn.net/u013378306/article/det ...

  7. PHP 扩展 trie-tree, swoole过滤敏感词方案

    在一些app,web中评论以及一些文章会看到一些*等,除了特定的不显示外,我们会把用户输入的一些敏感字符做处理,具体显示为*还是其他字符按照业务区实现. 下面简单介绍下业务处理. 原文地址:小时刻个人 ...

  8. java过滤敏感词汇

    前言 现在几乎所有的网站再发布带有文字信息的内容时都会要求过滤掉发动的.不健康的.影响社会安定的等敏感词汇,这里为大家提供了可以是现在这种功能的解决方案 第一种方式 创建敏感词汇文件:首先需要准备一个 ...

  9. (转)两种高效过滤敏感词算法--DFA算法和AC自动机算法

    原文:https://blog.csdn.net/u013421629/article/details/83178970 一道bat面试题:快速替换10亿条标题中的5万个敏感词,有哪些解决思路? 有十 ...

随机推荐

  1. 部署Hadoop2.0高性能集群

    废话不多说直接实战,部署Hadoop高性能集群: 拓扑图: 一.实验前期环境准备: 1.三台主机配置hosts文件:(复制到另外两台主机上) [root@tiandong63 ~]# more /et ...

  2. 1.RabbitMq - Work 模式

    RabbitMq - Work 模式 一.什么是Work模式 如果有几个消息都需要处理,且每个消息的处理时间很长,仅有一个消费者,那么当它在处理一个消息的时候,其他消息就只有等待. 等待有时候是好的, ...

  3. if-for-while

    if help if可以看看if的用法 if ls -l / ;then echo "ok";else echo "no" ;fi for for ((i=0; ...

  4. Linux dd烧写系统

    虽然用dd指令烧写系统很简单,但是久而久之忘得也太快了,赶紧整理一下. .img 系统镜像 .iso U盘启动引导文件 1. 先来查看本机磁盘情况,打开Linux终端界面(快捷键Ctrl + Alt ...

  5. echarts中国地图3D各个城市标点demo

    <!DOCTYPE html><html><head>    <meta charset="UTF-8">    <meta ...

  6. python 牛顿迭代法

    使用牛顿迭代法求方程  在x附近的一个实根. 赋值X,即迭代初值:用初值x代入方程中计算此时的f(x)=(a * x * x * x + b * x * x + c * x + d)和f’(x)=(3 ...

  7. UML建模综述

    一.概念 UML-Unified Model Language 统一建模语言,又称标准建模语言.是用来对软件密集系统进行可视化建模的一种语言.作为一个支持模型化和软件系统开发的图形化语言,UML为软件 ...

  8. [Python]统计1个元素在列表中的出现次数

    使用列表自带的count方法: list.count(element) 示例:  列表a,有4个元素,其中值1出现3次 In []: a=[,,,] In []: a Out[]: [, , , ] ...

  9. vue指令实现拖动的高级写法

    不熟悉vue自定义指令看这里: https://cn.vuejs.org/v2/guide/custom-directive.html vue指令实现拖动方法很方便也挺简单,但是网上大部分的教程代码, ...

  10. hadoop安装和环境配置---1

    一.安装java 1.下载 : yum install java-1.7.0-openjdk 2.配置环境变量 vim /etc/profile 要先看自己安装的java全名 然后再环境配置 expo ...