Javascript 用字符串中的URL替换Regexp表情失败

您好，我正在创建一个网站，其中我有一个聊天室，用户输入被过滤为html实体，唯一没有转义的是图像和网站URL的链接。此外，我还添加了一些在初始html编码后也被过滤掉的表情符号，这就是问题所在

我有一个笑脸，在我的笑脸对象中有一个键<代码>“：/”：“精灵不确定” 这显然与http://、ftp://等冲突

下面是我目前正在使用的代码，作为第2阶段编码-替代笑脸：

var escapeRegExp = function( string ) {
    return string.replace(/([.*+?^=!:${}()|\[\]\/\\])/g, "\\$1");
}

var replaceAll = function( string, find, replace ) {
    return string.replace(new RegExp(escapeRegExp(find), 'gi'), replace);
}   

var filterEmoticons = function( str ) {

    var emoticons = {
        "o:)": "sprite-angel",
        ">:(": "sprite-angry",
        ":}": "sprite-aww",
        "^~^": "sprite-aww2",
        "{blush}": "sprite-blushing",
        ":<": "sprite-childish",
        ":s": "sprite-confused",
        "{creepy}": "sprite-creepy",
        ":'(": "sprite-crying",
        "{cthulu}": "sprite-cthulhu",
        ":3": "sprite-cute",
        "{devil}": "sprite-devil",
        ">_<": "sprite-gah",
        ">o<": "sprite-gah2",
        ":o": "sprite-gasping",
        "$_$": "sprite-greedy",
        ":d": "sprite-grinning",
        ";d": "sprite-grinning-winking",
        ":>": "sprite-happy",
        "<:": "sprite-happy2",
        ":.": "sprite-happy3",
        "<3": "sprite-heart",
        "o.O": "sprite-huh",
        "O.o": "sprite-huh2",
        ":*": "sprite-kiss",
        "{lol}": "sprite-laughing",
        "{lips}": "sprite-lips",
        "{mad}": "sprite-madness",
        "{malicious}": "sprite-malicious",
        "{sick}": "sprite-sick",
        ":)": "sprite-smiling",
        ":|": "sprite-speechless",
        ">:)": "sprite-spiteful",
        "{stupid}": "sprite-stupid",
        "b)": "sprite-sunglasses",
        "d:": "sprite-terrified",
        "{win}": "sprite-thumb-up",
        "{fail}": "sprite-thumb-down",
        "-_-": "sprite-tired",
        ":p": "sprite-tongue-out",
        "xd": "sprite-tongue-out-laughing",
        ":b": "sprite-tongue-out-left",
        "p:": "sprite-tongue-out-up",
        "b:": "sprite-tongue-out-up-left",
        ";p": "sprite-tongue-out-winking",
        ":/": "sprite-uncertain",
        ":\\": "sprite-uncertain2",
        ":(": "sprite-unhappy",
        ";)": "sprite-winking",
        "x3": "sprite-x3",
        ";3": "sprite-cute-winking"
    };



    for ( var i in emoticons ) {
        str = replaceAll( str, i, '<em class="sprite '+emoticons[i]+'"></em>' );
    }

    return str;

}   

var escapeRegExp=函数（字符串）{
返回字符串.replace（/（[.*+？^=！：${}（）\[\]\/\]]）/g，“\\$1”）；
}
var replaceAll=函数（字符串、查找、替换）{
返回string.replace（新的RegExp（escapeRegExp（find），'gi'），replace）；
}   
var filterEmoticons=函数（str）{
变量表情={
“o:）”：“精灵天使”，
“：（“：”精灵愤怒“，
“：}”：“精灵aww”，
“^~^”：“雪碧-aww2”，
“{脸红}”：“精灵脸红”，
“：”：“精灵的孩子气”，
“：s”：“精灵困惑”，
“{令人毛骨悚然}”：“令人毛骨悚然的精灵”，
“：”（“：“精灵哭泣”，
“{cthulu}”：“雪碧cthulu”，
“：3”：“精灵可爱”，
“{魔鬼}”：“精灵魔鬼”，
“uu”：“雪碧嘎”，
“o”：“sprite-gah2”，
“：o”：“精灵喘息”，
“$\u$”：“贪婪的精灵”，
“：d”：“精灵咧嘴笑”，
“d”：“精灵笑着眨眼”，
“：”精灵快乐“，
“：”精灵快乐2“，
“：”精灵幸福3“，
“3”：“精灵之心”，
“o.o”：“雪碧啊”，
“O.O”：“雪碧-huh2”，
“：*”：“精灵之吻”，
“{lol}”：“精灵笑”，
“{lips}”：“精灵之唇”，
“{mad}”：“精灵的疯狂”，
“{恶意}”：“恶意精灵”，
“{sick}”：“精灵病了”，
“：）”：“精灵微笑”，
“：|”：“无言的精灵”，
“：）”：“恶毒的精灵”，
“{愚蠢}”：“愚蠢的精灵”，
“b）”：“雪碧太阳镜”，
d:：“被吓坏的精灵”，
“{win}”：“精灵竖起大拇指”，
“{fail}”：“精灵拇指朝下”，
“————”：“精灵累了”，
“：p”：“雪碧舌头伸出”，
“xd”：“精灵舌头笑出来”，
“：b”：“雪碧舌头伸出左侧”，
p:：“雪碧舌头往上伸”，
“b:：“雪碧舌头往左上方伸出”，
“p”：“精灵舌头向外眨眼”，
“：/”：“精灵不确定”，
“：\ \”：“精灵-不确定2”，
“：（“：“精灵不快乐”，
“；）”：“精灵眨眼”，
“x3”：“精灵x3”，
“3”：“精灵可爱的眨眼”
};
for（表情符号中的变量i）{
str=replaceAll（str，i，”）；
}
返回str；
}   

我必须承认我对regexp不太在行。

---

如果“/”是url的一部分，有没有办法防止替换/编码？

试试看。有些时候，当合乎逻辑的事情不起作用，我们需要做一些技巧或使用一些快速修复

想法是：

1） 在第2阶段编码之前添加另一个阶段-替换笑脸。该阶段是屏蔽给解决方案带来麻烦的对象

例如：将https://转换为替换笑脸时无法匹配的内容

k=$('#regex_string').val()

var mask_unmaskStringObj = {
    "https://":"httpsMask",
    "http://": "httpMask",
    "ftp://":"ftpMask"
}

for(each in mask_unmaskStringObj) {
    //match https://, http://, ftp:// etc
    //and replace to httpsMaskString, httpMaskString, ftpMaskString etc
    k = k.replace(new RegExp(each,'g'), function() {
        return mask_unmaskStringObj[each]
    })
}

$('#outputEn').val(k)

2） 替换你的笑脸-平滑，没有任何问题，例如https，因为现在它们没有任何冲突字符串。

3） 重置你的屏蔽字符串

for(each in mask_unmaskStringObj) {
    //Match httpsMaskString, httpMaskString, ftpMaskString etc
    //and replace it to match https://, http://, ftp:// etc
    k = k.replace(new RegExp(mask_unmaskStringObj[each],'g'), function() {
        return each
    })
}

---

您可能只想让用户方便地打开和关闭自动笑脸替换。除了URL之外，还有一些潜在的问题可能无法替换：（可能他们使用了旁白来谈论bo b）。你是对的，你没有想过可以在冒号前面添加一个字符否定，比如

[^ps]

，这意味着如果

：

前面的字符是p或s，它不会匹配，这将消除

http://

和

https://

的问题。当然，您可能必须对此运行一个反向引用，这意味着它将变成类似于“

”（[^ps]）：/”：“$1sprite ungulate”

（如果可以的话，我不确定）。这不是很吸引人，但这里有一个可能会起作用：（链接指向regex101，它允许您测试regexp）。它只是检查前一个字符是空白还是字符串的开头，然后检查下一个字符是否是空白（当然是字符串的结尾），并逐字匹配

：/

。另一种解决方案是，只有当微笑被空白包围时才允许微笑。