logo

Hvordan kode og dekode en URL i JavaScript?

Koding og dekoding av URL-er i JavaScript er avgjørende for nettutvikling, spesielt når du lager GET-forespørsler med søkeparametere. Denne prosessen sikrer at spesialtegn i URL-er tolkes riktig av serveren. Mellomrom konverteres for eksempel til %20 eller + i URL-er. Denne veiledningen dekker hvordan du bruker JavaScript-funksjoner som encodeURI(), encodeURIComponent(), escape(), decodeURI(), decodeURIComponent() og unescape() for effektiv URL-koding og dekoding.

Eksempel:

  • Åpne www.google.com og skriv et søkeord geeks for nerder.
  • Etter at søkeresultatene vises, observer nettleserens URL-linje. Nettleserens URL vil bestå av %20 eller +-tegn i stedet for mellomrom.
  • Nettadressen vises slik: https://www.google.com/search?q=geeks%20for%20geeks eller https://www.google.com/search?q=geeks+for+geeks

Merk : Nettleseren konverterte mellomrommene til + eller %20-tegn automatisk.



Kode en URL: Koding i Javascript kan oppnås ved å bruke:

Innholdsfortegnelse


1. JavaScript encodeURI-funksjon

De encodeURI() funksjon brukes til å kode fullstendig URI. Denne funksjonen koder spesialtegnet bortsett fra (, / ?: @ & = + $ #) tegn.

Syntaks:

encodeURI( complete_uri_string );>
Javascript
const url = 'https://www.google.com/search?q=geeks for geeks'; const encodedURL = encodeURI(url); console.log(encodedURL)>

Produksjon
https://www.google.com/search?q=geeks%20for%20geeks>

2. JavaScript encodeURIComponent() funksjon

De encodeURIConponent() funksjon brukes til å kode noen deler eller komponenter av URI. Denne funksjonen koder spesialtegnene. I tillegg koder den for følgende tegn: , / ? : @ & = + $ #

Syntaks:

encodeURIComponent( uri_string_component );>
Javascript
const component = 'geeks for geeks'; const encodedComponent = encodeURIComponent(component); console.log(encodedComponent);>

Produksjon
geeks%20for%20geeks>

3. JavaScript escape() funksjon

JavaScript escape() funksjon tar en streng som en enkelt parameter og koder strengen som kan overføres over datanettverket som støtter ASCII-tegn. Koding er prosessen med å konvertere ren tekst til chiffertekst.

Syntaks:

escape( string )>

Merk: Escape()-funksjonen koder bare spesialtegnene, denne funksjonen er utdatert.

Unntak: @ – + . /*_

matematikk pow java
Javascript
const url = 'https://www.google.com/search?q=geeks for geeks'; const encodedURL = encodeURI(url);// encoding using encodeURI console.log(encodedURL) console.log(' ' + escape(url)); //encoding using escape>

Produksjon
https://www.google.com/search?q=geeks%20for%20geeks https%3A//www.google.com/search%3Fq%3Dgeeks%20for%20geeks>

Dekoding av en URL

Dekoding i Javascript kan oppnås ved å bruke

1. JavaScript decodeURI() funksjon

De decodeURI() funksjon brukes til å dekode URI generert av kodeURI() .

Syntaks:

decodeURI( complete_encoded_uri_string )>

Eksempel : Dette eksemplet beskriver decodeURI() funksjon av Javascript .

Javascript
const url = 'https://www.google.com/search?q=geeks%20for%20geeks'; const decodedURL = decodeURI(url); console.log(decodedURL)>

Produksjon
https://www.google.com/search?q=geeks for geeks>

2. JavaScript decodeURIComponent() funksjon

De decodeURIConponent() funksjon brukes til å dekode noen deler eller komponenter av URI generert av encodeURIComponent().

Syntaks:

decodeURIComponent( encoded_uri_string_component )>

Eksempel : Dette eksemplet beskriver decodeURIConponent() av Javascript.

Javascript
const component = 'geeks%20for%20geeks' const decodedComponent = decodeURIComponent(component); console.log(decodedComponent)>

Produksjon
geeks for geeks>

3. JavaScript unescape() funksjon

Denne funksjonen tar en streng som en enkelt parameter og bruker den til å dekode den strengen som er kodet av escape()-funksjonen. Den heksadesimale sekvensen i strengen erstattes av tegnene de representerer når de dekodes via unescape() funksjon.

Syntaks:

unescape(string)>

Merk: Denne funksjonen dekoder kun spesialtegnene, denne funksjonen er utdatert.

Unntak: @ – + . /*_

Javascript
const url = 'https://www.google.com/search?q=geeks for geeks'; const encodedURL = encodeURI(url); console.log(encodedURL) console.log(escape(url)); console.log(decodeURI(encodedURL)); console.log(unescape(encodedURL));>

Produksjon
https://www.google.com/search?q=geeks%20for%20geeks https%3A//www.google.com/search%3Fq%3Dgeeks%20for%20geeks https://www.google.com/search?q=geeks for geeks https://www.google.com/search?q=geeks for ...>

4. JavaScript spørrestreng-modul

Spørrestrengmodulen gir verktøy for å analysere og formatere URL-spørrestrenger. Den kan brukes til å kode og dekode URL-komponenter.

Kode en URL:

For å kode en URL, kan vi bruke funksjonen querystring.stringify() for å lage en spørringsstreng fra et objekt og deretter bruke encodeURIComponent() for å kode den resulterende strengen.

JavaScript
const querystring = require('querystring'); const urlParams = {  q: 'geeks for geeks',  page: 1,  sort: 'desc' }; const encodedURL = 'https://www.google.com/search?' + querystring.stringify(urlParams); console.log(encodedURL);>


Produksjon:

https://www.google.com/search?q=geeks%20for%20geeks&page=1&sort=desc>

Dekoding av en URL:

For å dekode en URL, kan vi bruke funksjonen querystring.parse() til å analysere spørringsstrengen inn i et objekt og deretter få tilgang til de dekodede verdiene.

JavaScript
const decodedParams = querystring.parse('q=geeks%20for%20geeks&page=1&sort=desc'); console.log(decodedParams.q); // Output: geeks for geeks console.log(decodedParams.page); // Output: 1 console.log(decodedParams.sort); // Output: desc>


Forskjellen decodeURIConponent og decodeURI:

decodeURIConponent decodeURI
Definisjon DecodeURIComponent()-funksjonen brukes til å dekode noen deler eller komponenter av URI generert av encodeURIComponent().Dekoding i Javascript kan oppnås ved å bruke decodeURI-funksjonen.
Syntaks decodeURIComponent(encoded_uri_string_component)decodeURI( komplett_kodet_uri_streng )
Spesialtegnkoding Den krever encodeURIComponent(url)-streng slik at den kan dekode disse tegnene.Den tar encodeURI(url)-streng slik at den ikke kan dekode tegn (, / ? : @ & = + $ #)
Eksempel

decodeURIComponent(%41) Den returnerer A

decodeURIConponent(%26): Den returnerer &

decodeURI(%41): Den returnerer A

decodeURI(%26): Den returnerer %26

URL-koding og -dekoding i JavaScript er avgjørende for sømløs webutvikling. Ved å bruke funksjoner som encodeURI(), encodeURIComponent(), escape(), decodeURI(), decodeURIComponent() og unescape(), kan utviklere sikre at URL-ene deres er riktig formatert og lesbare av servere. Denne ferdigheten er avgjørende for å håndtere søkeparametere i GET-forespørsler og sikrer en jevn brukeropplevelse på nettstedet ditt.