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 - 过滤敏感字符

before

源码示例
