Codificação de URL em JavaScript
- Qual é a diferença entre URI e URL?
-
Codificando um URL usando o método
encodeURI()em JavaScript -
Codificando um URL usando o método
encodeURIComponent()em JavaScript
Uma codificação de URL é um processo de codificação de caracteres de 8 bits dentro do URL com% seguido por um caractere hexadecimal. Também é conhecido como codificação de porcentagem, pois estamos substituindo os caracteres por um sinal de porcentagem. Uma codificação de URL pode ser feita usando quase qualquer linguagem de programação, incluindo JavaScript.
A razão por trás da codificação de um URL é que um URL pode conter apenas caracteres específicos da tabela ASCII. Todos os outros caracteres presentes no URL precisam ser codificados para que o URL funcione corretamente. Os caracteres que precisam de codificação em um URL são ':', '/', '?', '#', '[', ']', '@', '!', '$', '&', "'", '(', ')', '*', '+', ',', ';', '=', Bem como '%'. Para obter mais informações sobre esses caracteres e sua forma de codificação, você pode visitar este link.
Qual é a diferença entre URI e URL?
Antes de avançar, vamos primeiro obter um entendimento sobre URI e URL.
Um Uniform Resource Identifier (URI) é usado para identificar um recurso na Internet. Em contraste, Uniform Resource Locator (URL) é algo que o ajuda a localizar e alcançar esse recurso.
Um URI também pode ser um identificador, bem como um localizador, enquanto um URL só pode ser um localizador. Um URL vem em URI; portanto, ambos parecem um pouco semelhantes, mas têm diferenças sutis entre eles.
Por exemplo, facebook.com é um URL porque leva onde a página da web do Facebook está localizada, enquanto uma cafeteria próxima pode ser um URI porque você sabe onde fica a cafeteria (que é um recurso) e também sabe como chegar lá (o caminho).
Codificando um URL usando o método encodeURI() em JavaScript
O método encodeURI() é um dos métodos que pode ser usado para codificar uma URL em JavaScript. Este método pode ser usado se você tiver um URL completo.
Digamos que temos uma URL como https://en.wikipedia.org/[$q=english &language], e agora vamos codificar essa URL usando o método encodeURI() para ver qual saída esse método fornece.
const URL = "https://en.wikipedia.org/[$q=english &language]";
console.log(encodeURI(URL));
Resultado:
https://en.wikipedia.org/%5Bq=english%20&language%5D
Observe que esse método codifica apenas poucos caracteres em uma URL, como um espaço em branco e colchetes.
Este método não codificará os seguintes caracteres especiais.
encodeURI()` will not encode: `~!@#$&*()=:/,;?+'
Se você quiser codificar alguns dos outros caracteres especiais, pode usar o método encodeURIComponent().
Codificando um URL usando o método encodeURIComponent() em JavaScript
O método encodeURIComponent() também pode ser usado para codificar um URL. Este método pode ser usado se você tiver apenas uma parte de um URL. Como já vimos, o método encodeURI() codifica muito poucos caracteres, mas se você quiser codificar alguns outros caracteres também, pode usar o método encodeURIComponent().
Vamos pegar a mesma URL que pegamos anteriormente e ver qual saída obtemos quando usamos esse método para codificar a string.
const URL = "https://en.wikipedia.org/[$q=english &language]";
console.log(encodeURIComponent(URL));
Resultado:
https%3A%2F%2Fen.wikipedia.org%2F%5B%24q%3Denglish%20%26language%5D
Como você pode ver, esse método codificou a maior parte do URL.
Este método não codificará os seguintes caracteres especiais.
encodeURIComponent()` will not encode: `~!*()'
Dependendo de seus requisitos e uso, você pode usar qualquer um ou ambos os métodos acima para codificar uma URL em JavaScript.