¿cómo puedo hacer una jQuery jurar palabra/mala palabra filtro?

Question

Sé que hay muchos argumentos sobre por qué esta es una mala idea, pero en mi implementación estoy planeando habilitar/deshabilitar palabras malas en la configuración de la cuenta. En otras palabras, las palabras malas serán visibles por defecto, pero apagadas/ocultas si se le pregunta.

El plan será enviar una cadena JSON al cliente y dejar que el cliente filtre las palabras incorrectas.

cadena JSON

['swear1', 'swear2'] 

frase original

this phrase includes swear1 

salida final

this phrase includes **** 

esto es lo que he probado hasta ahora

$(document).ready (function() { 
     $('body').html().replace('asdf', 'ffff'); 
    }); 

ahora en una nota al margen, estoy usando asp.net mvc y "podría" hacer esto por el lado del servidor, pero estaba pensando que esto sería mejor si se descargara al cliente ... Estoy abierto a sugerencias en este.

Answer 1

Así que he tomado la sugerencia básica que @Harmen dio y la extendí a un plugin jQuery. Esta parece ser la mejor implementación que podría tener.

jQuery.profanityFilter

$(document).profanityFilter({ 
    replaceWith:'#', 
    customSwears: ['ass'], 
    externalSwears: '/swearWords.json' 
}) 

Answer 2

El objeto JSON que devuelve no puede tener nombres de atributos repetidos. En lugar de { w: 'Swear1', w: 'Swear2' } debe ser [ 'Swear1', 'Swear2' ].

Puede analizar el texto para filtrar y ajustar cada aparición de una maldición entre etiquetas <span> con un atributo de clase particular y alternarlas con una función. Ese debería ser un enfoque simple.

Answer 3

Al mover cosas de servidor a cliente, siempre debe considerar el ancho de banda contra el costo de procesamiento. Claro, tenerlo en el lado del cliente minimizará los costos de procesamiento, pero perderá mucho tiempo moviendo la lista de malas palabras al cliente.

Además, tenerlo en el servidor puede permitirle preprocesar las publicaciones, por ejemplo, y solo actualizarlo cuando cambie una regla, lo que ahorra aún más tiempo de proceso.

Answer 4

Algo como esto podría funcionar:

String.prototype.repeat = function(num){ 
    return new Array(num + 1).join(this); 
} 

var filter = ['ass', 'piss']; 

$('.post').text(function(i, txt){ 

    // iterate over all words 
    for(var i=0; i<filter.length; i++){ 

    // Create a regular expression and make it global 
    var pattern = new RegExp('\\b' + filter[i] + '\\b', 'g'); 

    // Create a new string filled with '*' 
    var replacement = '*'.repeat(filter[i].length); 

    txt = txt.replace(pattern, replacement); 
    } 

    // returning txt will set the new text value for the current element 
    return txt; 
}); 

Trabajando example en jsFiddle

Editar: límites Añadido por lo que no va a sustituir las palabras que contienen el palabrotas. He usado barras diagonales inversas dobles porque las barras diagonales inversas deben escaparse en una cadena, see this topic.

Answer 5

Querrá iterar sobre todas las palabras: para cada palabra, verifique si es una de sus palabras prohibidas antes de reemplazarla con asteriscos.

Para hacer esto de manera eficiente, tendrá que almacenar las palabras en una tabla hash:

var badWords = { 
    hello: true, 
    goodbye: true, 
}; 

iterar sobre cada palabra y luego ver si está en la tabla hash. (La interpretación de lo que comprende una "palabra" varía, dependiendo de si solo está buscando caracteres rodeados de espacios en blanco u otros caracteres no alfa.)

// Pseudocode 
for each word in content { 
    if (badWords[word]) { 
     // replace word with word.length * characters 
    } 
} 

Answer 6

Aquí hay una función liviana.

var filterWords = ["fool", "dumb", "shit", "ass", "couch potato"]; 
var rgx = new RegExp(filterWords.join("|"), "gi"); 
function wordFilter(str) {   
    return str.replace(rgx, "****");    
}