¿Debo usar encodeURI o encodeURIComponent para codificar URL?

Question

¿Cuál de estos dos métodos se debe usar para codificar URL?

Answer 1

Depende de lo que realmente está queriendo hacer.

encodeURI asume que la entrada es un URI completo que puede tener algunos caracteres que necesitan codificación.

encodeURIComponent codificará todo con un significado especial, por lo que usarlo para componentes de URIs como

var world = "A string with symbols & characters that have special meaning?"; 
var uri = 'http://example.com/foo?hello=' + encodeURIComponent(world); 

Answer 2

Si está codificando una cadena para insertar un componente de URL (un parámetro de cadena de consulta), debe llamar al encodeURIComponent.

Si está codificando una URL existente, llame al encodeURI.

Answer 3

http://xkr.us/articles/javascript/encode-compare/ tiene una gran discusión, con ejemplos. Para citar su resumen:

"El método escape() no codifica el carácter + que se interpreta como un espacio en el servidor, así como generado por formularios con espacios en sus campos. Debido a esta deficiencia y el hecho que esta función no maneja caracteres no ASCII correctamente, se debe evitar el uso de la fuga() siempre que sea posible La mejor alternativa es generalmente encodeURIComponent()

de escape() no codificar:.. @ */+

El uso del método encodeURI() es un poco más especializado que escape() en que codifica para URI en oposición a la cadena de consulta, que es parte de una URL. Utilice este método cuando necesite codificar una cadena a b Se usa para cualquier recurso que use URI y necesita ciertos caracteres para permanecer sin codificar. Tenga en cuenta que este método no codifica el carácter ', ya que es un carácter válido dentro de los URI.

encodeURI() no va a codificar: ~ @ # $ & *() =: /,; +'

Por último, el encodeURIComponent() método debe utilizarse en la mayoría de los casos cuando se codifica un componente único!? de un URI. Este método codificará ciertos caracteres que normalmente se reconocerían como caracteres especiales para URI, de forma que se puedan incluir muchos componentes. Tenga en cuenta que este método no codifica el carácter ', ya que es un carácter válido dentro de los URI.

encodeURIComponent() no va a codificar:! ~ *() '"

Answer 4

encodeURIComponent(): asume que su argumento es una parte (por ejemplo, el protocolo, el nombre de host, ruta o cadena de consulta) de un . URI por lo tanto, se escapa de los signos de puntuación que se utilizan para separar el portionsof un URI

encodeURI (.): se utiliza para la codificación de URL existente

Answer 5

En caso de que desee codificar estos caracteres también: ! ' *) (, entonces la solución es:

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

(source)

Answer 6

Como regla general el uso encodeURIComponent. No tengas miedo del nombre largo pensando que es más específico en su uso, para mí es el método más comúnmente utilizado.Tampoco se deje engañar por el uso de encodeURI porque lo probó y parece estar codificando correctamente, probablemente no es lo que pretendía usar y aunque su simple prueba con "Fred" en un campo de primer nombre funcionó, encontrará más tarde, cuando utilice texto más avanzado, como agregar un ampersand o un hashtag, fallará. Puede ver las otras respuestas por las razones por las que esto es.