come posso fare un filtro jQuery parolacce/parolacce?

Question

So che ci sono molti argomenti per spiegare perché questa è una cattiva idea, ma nella mia implementazione ho intenzione di abilitare/disabilitare le parolacce nelle impostazioni dell'account. In altre parole, le parolacce saranno visibili di default, ma disattivate/nascoste se richiesto.

Il piano sarà inviare una stringa JSON al client e lasciare che il client filtri le parolacce.

stringa JSON

['swear1', 'swear2'] 

frase originale

this phrase includes swear1 

output finale

this phrase includes **** 

questo è quello che ho provato finora

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

ora su una nota a margine, sto usando asp.net mvc e "potrei" farlo sul lato server, ma pensavo che sarebbe stato meglio se scaricato al client ... Sono aperto ai suggerimenti su questo.

Answer 1

Quindi ho preso il suggerimento di base che @Harmen ha dato e l'ho esteso in un plugin jQuery. Questa sembra essere la migliore implementazione che potrei mai venire in mente.

jQuery.profanityFilter

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

Answer 2

L'oggetto JSON restituito non può avere nomi di attributi ripetuti. Invece di { w: 'Swear1', w: 'Swear2' } dovrebbe essere [ 'Swear1', 'Swear2' ].

È possibile analizzare il testo per filtrare e avvolgere ogni occorrenza di una parolaccia tra i tag <span> con un particolare attributo di classe e attivarli con una funzione. Questo dovrebbe essere un approccio semplice.

Answer 3

Quando si spostano oggetti da un server all'altro, è necessario considerare sempre la larghezza di banda rispetto ai costi di elaborazione. Certo, avere sul lato client ridurrà al minimo i costi di elaborazione, ma perderai un sacco di tempo spostando l'elenco di parolacce al cliente.

Inoltre, averlo sul server può consentire di pre-elaborare i messaggi, ad esempio, e solo aggiornarlo quando una regola cambia, risparmiando ancora più tempo di elaborazione.

Answer 4

Qualcosa di simile potrebbe funzionare:

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; 
}); 

Lavorare example su jsFiddle

Edit: confini aggiunti in modo da non sostituire le parole che contengono le parolacce. Ho usato il doppio backslash perché i backslash dovrebbero essere sottoposti a escape in una stringa, see this topic.

Answer 5

Dovrai ripetere tutte le parole: per ogni parola, controlla se è una delle parole vietate prima di sostituirla con degli asterischi.

Per fare questo in modo efficace, ti consigliamo di memorizzare le parole in una tabella hash:

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

iterare su ogni parola e poi vedere se è nella tabella hash. (L'interpretazione di ciò che comprende una "parola" varia, a seconda che tu stia cercando personaggi circondati da spazi bianchi o altri caratteri non alpha.)

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

Answer 6

Questa è una funzione leggera.

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