Home / Questions / 49210
Accepted
Rubén
Asked: 2020-02-14 06:48:38 +0800 CST 2020-02-14 06:48:38 +0800 CST

Safe way to escape user input to be processed by regular expressions in JavaScript

  • 772

At https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions the following example is published:

function escapeRegExp(string) {
  return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); 
}

Is this the safe way to escape an end user supplied string, for example via a dialog?

Example:

/**
 * Ejemplo. Eliminar todas las instancias de una subcadena en una cadena.
 * 
 * Require dos entradas al usuario, cadena y subcadena.
 * Debemos asegurarnos que la subcadena es segura para ser procesada
 * como parte de una expresión regular.
 */

/** 
  * Tomado de 
  * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions
  * ¿Es esto seguro?
  */
function escapeRegExp(string) {
  return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); 
}

// Cadena a procesar
var cadena = "Test abc test test abc test test test abc test test abc";
var entradaUsuario1 = prompt("Escribe la cadena a procesar",cadena);

// Subcadena a eliminar
var subcadena = "abc";
var entradaUsuario2 = prompt("Escribe la subcadena a eliminar",subcadena);

// Aplicar la función para escapar la entrada de usuario
var re = new RegExp(escapeRegExp(entradaUsuario2),'g');

// Aplicar reemplazo
var resultado = entradaUsuario1.replace(re, '');

// Imprimir en la consola el resultado
console.log(resultado);

javascript

1 Answers

  1. Best Answer

    It is a safe way, but characters are being escaped by others.

    • The ]only has a special meaning within a character class (closing it). But if we're already escaping the [, there couldn't be any classes inside the regular expression.
    • The }only has a special meaning as the end of the range quantifier {m,n} . And, again, if we're escaping the {, there couldn't be such a quantifier inside the regex.


    Escape metacharacters

    The metacharacters (or special characters) are exclusively:

    \   ^   $   .   |   ?   *   +   (   )   [   {


    The simplified function:

    function escaparRegex(string) {
    return string.replace(/[\\^$.|?*+()[{]/g, '\\$&'); 
}


    Escaping metacharacters in a character class

    There may be the case where you want to add characters within a character class (in square brackets), for example in

    var re = new RegExp("\\S+{2,} [" + caracteres + "]{3,}")

    In that case, you must escape:

    ^ (al principio)   \   ]   -


    The function to escape the content of a character class:

    function escaparClaseRegex(string) {
    return string.replace(/^\^|[-\]\\]/g, '\\$&');
}


    Escaping metacharacters in replacement text

    When using cadena.replace(re, reemplazo), there are some replacement patterns that have special meaning. To ensure that it is being replaced by the literal value, the $as $$to:

    $$   $&   $`   $'   $n (n es un dígito)

    The function to escape the replacement text:

    function escaparReemplazoRegex(string) {
    return string.replace(/\$(?=[$&`'\d])/g, '$$$$');
}
    • 5