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. maven整合ssm框架

    1.创建maven web工程 创建完成后,项目结构如下 2.项目配置文件 在pom.xml中添加SSM框架相关jar包的依赖关系,pom.xml代码如下 <?xml version=" ...

  2. MySQL 中<=>用法（长知识）

    https://www.runoob.com/mysql/mysql-operator.html MySQL 运算符 本章节我们主要介绍 MySQL 的运算符及运算符的优先级. MySQL 主要有以下 ...

  3. Rocketmq同步发送消息

    package com.bfxy.rocketmq.quickstart; import org.apache.rocketmq.client.exception.MQBrokerException; ...

  4. python 3.6闭包+循环获取出字典中所有的值并保存在list中

    def list_test(): list1=[] def list_all_dict(a): #检测字段类型 if isinstance(a,dict): for x in range(len(a) ...

  5. CollectionUtils

    public class CollectionUtils { /** * 数组是否包含元素 * @param arr * @param str * @return */ public static b ...

  6. Log统一管理类

    import android.util.Log; /** * Log统一管理类 */ public class L{ private L(){ /* cannot be instantiated */ ...

  7. ObjectId初探

    ObjectId MongoDB每个集合存储的每个文档必须有一个"_id"键,默认是个ObjectId对象. "_id"作为当前文档在集合的唯一标识. 71st ...

  8. es6 单例

    class Singleton { constructor() { this.conn = this.connect(); } static getInstance() { if (!Singleto ...

  9. 【Zookeeper】本地模式安装

    安装步骤 上传gz包 通过rz命令,将zookeeper-3.4.10.tar.gz安装包上传到/opt/soft/文件夹下. [root@bigdata111 soft]# rz [root@big ...

  10. nexus私服库被误删如何恢复

    恢复步骤: 1,登录nexus服务器,找到nexus安装目录(默认/usr/local/下): 2,找到sonatype-work/nexus/trash 下找到你删除的库: 3,copy到指定的so ...