Función encodeURIComponent()‎ en JavaScript

Función encodeURIComponent()‎‎‎ en JavaScript
Función encodeURIComponent()‎‎‎ en JavaScript

La función encodeURIComponent()‎ en javascript codifica un componente de un componente URI (Identificador uniforme de recursos) reemplazando cada copia de un carácter determinado con una o más secuencias de escape que representan la codificación UTF-8 del carácter en cuestión.

Características generales

La función encodeURIComponent escapa a todos los caracteres excepto:

A - Z  a - z  0 - 9  -  _  .  !  ~  *  '  (  )

La función difiere encodeURIComponent de la función encodeURI como se muestra en el siguiente ejemplo. Tenga en cuenta que la principal diferencia entre ellas está en la codificación de los caracteres reservados y el código #:

var set1 =  ";, /?: @ & = + $ #" ;   // caracteres reservados 
var set2 =  "-_.! ~ * '()" ;     // etiquetas no reservadas 
var set3 =  "#" ;             // código cuadrado 
var set3 =  "ABC abc 123" ;   // letras, números y espacios

console.log(encodeURI(set1)); // ;,/?:@&=+$#
console.log(encodeURI(set2)); // -_.!~*'()
console.log(encodeURI(set3)); // #
console.log(encodeURI(set4)); // ABC%20abc%20123 (observe cómo se simboliza el espacio)

console.log(encodeURIComponent(set1)); // %3B%2C%2F%3F%3A%40%26%3D%2B%24%23
console.log(encodeURIComponent(set2)); // -_.!~*'()
console.log(encodeURIComponent(set3)); // %23
console.log(encodeURIComponent(set4)); // ABC%20abc%20123 (observe cómo se simboliza el espacio)

Utilizar la función encodeURIComponent sobre los campos ingresados ​​por el usuario desde los formularios que serán enviados por POST al servidor, este codificará el carácter &que se pueda generar automáticamente durante el proceso de conversión de códigos HTML u otros.

Por ejemplo, si el usuario escribe la cadena de texto » Jack & Jill«, la cadena se codificará como » Jack & Jill, y sin usar la función encodeURIComponent, el código del servidor se interpretará como el inicio de un nuevo campo de formulario, lo que generará errores en el procesamiento del formulario.

Cuando usa el siguiente tipo MIME application/x-www-form-urlencoded, código Vcioda en +lugar de los espacios en blanco, por lo que podemos usar la función encodeURIComponent para codificar . +%20

Si queremos seguir el RFC3986 Directiva (que se reserva el! , ')(*, a pesar de que estos personajes no tienen ningún uso especial en los enlaces de URI), podemos utilizar la siguiente función:

function fixedEncodeURIComponent(str) {
  return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16);
  });
}

Estructura encodeURIComponent()‎ javascript

encodeURIComponent ( str );

str

Una cadena que representa un componente del URI.

Valor a devolver

Cadena que representa la versión codificada del URI del componente.

Soporte de navegadores

CaracterísticaChromeFirefoxIEÓperaSafari
Soporte básico