escape - javascript encodeuricomponent

¿Codificar URL en JavaScript?

Question

¿Cómo codificar de forma segura una URL usando JavaScript de tal manera que se pueda colocar en una cadena GET?

var myUrl = "http://example.com/index.html?param=1&anotherParam=2";
var myOtherUrl = "http://example.com/index.html?url=" + myUrl;

¿Supongo que necesita codificar la variable myUrl en esa segunda línea?

Answer 1

¿Qué es la codificación de URL?

Una URL debe estar codificada cuando hay caracteres especiales ubicados dentro de la URL. Por ejemplo:

console.log(encodeURIComponent(''?notEncoded=&+''));

Podemos observar en este ejemplo que todos los caracteres, excepto la cadena notEncoded están codificados con signos%. La codificación de URL también se conoce como codificación de porcentaje porque escapa a todos los caracteres especiales con un%. Luego, después de este signo%, cada carácter especial tiene un código único.

¿Por qué necesitamos codificación de URL:

Ciertos caracteres tienen un valor especial en una cadena de URL. Por ejemplo, el? carácter denota el comienzo de una cadena de consulta. Para poder ubicar un recurso en la web con éxito, es necesario distinguir entre un carácter como parte de una cadena o parte de la estructura de la URL.

¿Cómo podemos lograr la codificación de URL en JS:

JS ofrece una gran cantidad de funciones de utilidad integradas que podemos utilizar para codificar fácilmente las URL. Estas son dos opciones convenientes:

1. encodeURIComponent() : toma un componente de un URI como argumento y devuelve la cadena de URI codificada.
2. encodeURI() : toma un URI como argumento y devuelve la cadena URI codificada.

Ejemplo y advertencias:

Tenga en cuenta que no se pasa la URL completa (incluido el esquema, por ejemplo, https: //) a encodeURIComponent() . Esto puede realmente transformarlo en una URL no funcional. Por ejemplo:

// for a whole URI don''t use encodeURIComponent it will transform
// the / characters and the URL won''t fucntion properly
console.log(encodeURIComponent("http://www.random.com/specials&char.html"));

// instead use encodeURI for whole URL''s
console.log(encodeURI("http://www.random.com/specials&char.html"));

Podemos observar si ponemos la URL completa en el encodeURIComponent de encodeURIComponent que las barras inclinadas (/) también se convierten en caracteres especiales. Esto hará que la URL ya no funcione correctamente.

Por lo tanto (como su nombre lo indica) use:

1. encodeURIComponent en una parte determinada de una URL que desea codificar.
2. encodeURI en una URL completa que desea codificar.

Answer 2

Compruebe la función encodeURIComponent(str) y encodeURI(str) .
En tu caso, esto debería funcionar:

var myOtherUrl = 
       "http://example.com/index.html?url=" + encodeURIComponent(myUrl);

Answer 3

Nada funcionó para mí. Todo lo que estaba viendo era el HTML de la página de inicio de sesión, regresando al lado del cliente con el código 200. (302 al principio, pero la misma solicitud de Ajax que carga la página de inicio de sesión dentro de otra solicitud de Ajax, que se suponía que era una redirección en lugar de cargar el plano) texto de la página de inicio de sesión).

En el controlador de inicio de sesión, he añadido esta línea:

Response.Headers["land"] = "login";

Y en el controlador global de Ajax, hice esto:

$(function () {
    var $document = $(document);
    $document.ajaxSuccess(function (e, response, request) {
        var land = response.getResponseHeader(''land'');
        var redrUrl = ''/login?ReturnUrl='' + encodeURIComponent(window.location);
        if(land) {
            if (land.toString() === ''login'') {
                window.location = redrUrl;
            }
        }
    });
});

Ahora no tengo ningún problema, y ​​funciona como un encanto.

Answer 4

Para codificar una URL, como se ha dicho antes, tiene dos funciones:

encodeURI()

y

encodeURIComponent()

La razón por la que ambos existen es que el primero conserva la URL con el riesgo de dejar muchas cosas sin escapar, mientras que el segundo codifica todo lo necesario.

Con el primero, podría copiar la URL recién escapada en la barra de direcciones (por ejemplo) y funcionaría. Sin embargo, sus ''&'' no escapados podrían interferir con los delimitadores de campo, los ''='' interferirían con los nombres y valores de los campos, y los ''+'' se verían como espacios. Pero para datos simples cuando desea conservar la naturaleza de la URL de lo que está escapando, esto funciona.

El segundo es todo lo que necesita hacer para asegurarse de que nada en su cadena interfiere con una URL. Deja varios caracteres sin importancia sin escapar, por lo que la URL permanece lo más legible posible sin interferencias. Una URL codificada de esta manera ya no funcionará como una URL sin quitarla.

Entonces, si puede tomarse el tiempo, siempre desea usar encodeURIComponent () - antes de agregar los pares de nombre / valor, codifique el nombre y el valor usando esta función antes de agregarlo a la cadena de consulta.

Me está costando mucho encontrar razones para usar encodeURI (): se lo dejo a las personas más inteligentes.

Answer 5

Para evitar la codificación doble, es una buena idea descifrar la url antes de codificar (si está tratando con urls ingresadas por el usuario, por ejemplo, que ya podrían estar codificadas).

Digamos que tenemos abc%20xyz 123 como entrada (un espacio ya está codificado):

encodeURI("abc%20xyz 123")            //   wrong: "abc%2520xyz%20123"
encodeURI(decodeURI("abc%20xyz 123")) // correct: "abc%20xyz%20123"

Answer 6

Personalmente, encuentro que muchas API desean reemplazar "" con "+", así que uso lo siguiente:

encodeURIComponent(value).replace(/%20/g,''+'');

escape se implementa de manera diferente en diferentes navegadores y encodeURI no codifica la mayoría de los caracteres que son funcionales en un URI (como # e incluso /); está diseñado para ser utilizado en un URI / URL completo sin romperlo.

NOTA : utiliza encodeURIComponent para los valores en la cadena de consulta (no los campos / nombres de valores y definitivamente no la URL completa). Si lo hace de otra manera, no codificará caracteres como =,?, &, Posiblemente dejando su cadena de consulta expuesta.

Ejemplo:

const escapedValue = encodeURIComponent(value).replace(/%20/g,''+'');
const url = ''http://example.com/?myKey='' + escapedValue;

Answer 7

Puedes usar la biblioteca de esapi y codificar tu url usando la siguiente función. La función persiste en que ''/'' no se pierda en la codificación mientras que el resto del contenido del texto está codificado:

function encodeUrl(url)
{
    String arr[] = url.split("/");
    String encodedUrl = "";
    for(int i = 0; i<arr.length; i++)
    {
        encodedUrl = encodedUrl + ESAPI.encoder().encodeForHTML(ESAPI.encoder().encodeForURL(arr[i]));
        if(i<arr.length-1) encodedUrl = encodedUrl + "/";
    }
    return url;
}

https://www.owasp.org/index.php/ESAPI_JavaScript_Readme

Answer 8

Quédate con developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… . La función developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… no se molesta en codificar muchos caracteres que tienen importancia semántica en las URL (por ejemplo, "#", "?" Y "&"). escape() está en desuso, y no se molesta en codificar los caracteres "+", que se interpretarán como espacios codificados en el servidor (y, como lo señalan otros aquí, no codifica correctamente los caracteres no ASCII).

Hay una buena explicación de la diferencia entre encodeURI() y encodeURIComponent() otros lugares. Si desea codificar algo para que se pueda incluir de manera segura como un componente de un URI (por ejemplo, como un parámetro de cadena de consulta), desea usar encodeURIComponent() .

Answer 9

Si está utilizando jQuery, me gustaría $.param método $.param . La URL codifica un objeto que asigna campos a valores, que es más fácil de leer que llamar a un método de escape en cada valor.

$.param({a:"1=2", b:"Test 1"}) // gets a=1%3D2&b=Test+1

Answer 10

Similar tipo de cosa que probé con javascript normal

function fixedEncodeURIComponent(str){
     return encodeURIComponent(str).replace(/[!''()]/g, escape).replace(//*/g, "%2A");
}

Answer 11

Tienes tres opciones:

• escape() no codificará: @*/+

• encodeURI() no codificará: ~!@#$&*()=:/,;?+''

• encodeURIComponent() no codificará: ~!*()''

Pero en su caso, si desea pasar una URL a un parámetro GET de otra página, debe usar escape o encodeURIComponent , pero no encodeURI .

Consulte la pregunta sobre el desbordamiento de pila Práctica recomendada: escape o encodeURI / encodeURIComponent para obtener más información.

Answer 12

encodeURIComponent () es el camino a seguir.

var myOtherUrl = "http://example.com/index.html?url=" + encodeURIComponent(myUrl);

PERO debe tener en cuenta que existen pequeñas diferencias con la versión php urlencode() y, como se menciona en @CMS, no codificará cada carácter. Chicos en http://phpjs.org/functions/urlencode/ hicieron js equivalente a phpencode() :

function urlencode(str) {
  str = (str + '''').toString();

  // Tilde should be allowed unescaped in future versions of PHP (as reflected below), but if you want to reflect current
  // PHP behavior, you would need to add ".replace(/~/g, ''%7E'');" to the following.
  return encodeURIComponent(str)
    .replace(/!/g, ''%21'')
    .replace(/''/g, ''%27'')
    .replace(//(/g, ''%28'')
    .replace(//)/g, ''%29'')
    .replace(//*/g, ''%2A'')
    .replace(/%20/g, ''+'');
}

Answer 13

Codificar cadena de URL

var url = $(location).attr(''href''); //get current url //OR var url = ''folder/index.html?param=#23dd&noob=yes''; //or specify one var encodedUrl = encodeURIComponent(url); console.log(encodedUrl); //outputs folder%2Findex.html%3Fparam%3D%2323dd%26noob%3Dyes for more info go http://www.sitepoint.com/jquery-decode-url-string