Vraag Codeer URL in JavaScript?


Hoe codeer je veilig een URL met JavaScript zodat deze in een GET-reeks kan worden geplaatst?

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

Ik neem aan dat je het moet coderen myUrl variabel op die tweede regel?


2121
2017-12-02 02:37


oorsprong


antwoorden:


Bekijk de ingebouwde functie encodeURIComponent(str) en encodeURI(str).
In uw geval zou dit moeten werken:

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

2489
2017-12-02 02:43



Je hebt drie opties:

  • escape() zal niet coderen: @*/+

  • encodeURI() zal niet coderen: ~!@#$&*()=:/,;?+'

  • encodeURIComponent() zal niet coderen: ~!*()'

Maar in jouw geval, als je wilt slagen voor een URL in een GET parameter van andere pagina, zou u moeten gebruiken escape of encodeURIComponent, maar niet encodeURI.

Zie Stack Overflow-vraag Beste werkwijze: escape, of encodeURI / encodeURIComponent voor verdere discussie.


1373
2017-12-02 02:49



Blijf bij encodeURIComponent(). De functie encodeURI() doet niet de moeite om veel tekens te coderen die van semantisch belang zijn in URL's (bijvoorbeeld "#", "?" en "&"). escape() is verouderd en neemt niet de moeite om "+" tekens te coderen, die worden geïnterpreteerd als gecodeerde spaties op de server (en, zoals anderen benadrukken, niet-URL-coderende niet-ASCII-tekens).

Er is een leuke uitleg van het verschil tussen encodeURI() en encodeURIComponent() ergens anders. Als u iets wilt coderen zodat het veilig kan worden opgenomen als een onderdeel van een URI (bijvoorbeeld als een queryreeksparameter), wilt u gebruiken encodeURIComponent().


156
2018-05-29 23:54



Persoonlijk vind ik dat veel API's "" willen vervangen door "+", dus gebruik ik het volgende:

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

escape is anders geïmplementeerd in verschillende browsers en encodeURI codeert niet de meeste karakters die functioneel zijn in een URI (zoals # en even /) - het is gemaakt om gebruikt te worden op een volledige URI / URL zonder het te verbreken.

NOTITIE: U gebruikt encodeURIComponent voor de waarden van de querystring (geen velden / waardennamen en zeker niet de volledige URL). Als u het op een andere manier doet, zal het geen karakters als =,?, & Coderen, waardoor uw queryreeks mogelijk wordt blootgesteld.

Voorbeeld:

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

66
2017-12-15 08:47



Als u jQuery gebruikt zou ik voor gaan $.param methode. Het URL-codeert een object toewijzing velden naar waarden, die is gemakkelijker te lezen dan het aanroepen van een escape-methode op elke waarde.

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

35
2018-05-13 03:32



Om een ​​URL te coderen, zoals eerder gezegd, hebt u twee functies:

encodeURI()

en

encodeURIComponent()

De reden dat beide bestaan, is dat de eerste de URL bewaart met het risico dat er te veel dingen onaantrokken blijven, terwijl de tweede alles codeert wat nodig is.

Met de eerste kunt u de pasgevulde URL kopiëren naar de adresbalk (bijvoorbeeld) en het zou werken. Echter, uw niet-omcirkelde '&' s zouden de veldbegrenzers verstoren, de '=' s zouden interfereren met veldnamen en waarden, en de '+' s zouden op spaties lijken. Maar voor eenvoudige gegevens wanneer u de URL-aard van wat u wilt behouden, wilt behouden, werkt dit.

De tweede is alles wat je moet doen om ervoor te zorgen dat niets in je string interfereert met een URL. Het laat verschillende onbelangrijke personages niet onder escaping zodat de URL zo leesbaar mogelijk is zonder interferentie. Een URL die op deze manier is gecodeerd, werkt niet langer als een URL zonder deze te ontrafelen.

Dus als u de tijd kunt nemen, wilt u altijd encodeURIComponent () gebruiken - voordat u naam / waarde-paren toevoegt, codeert u zowel de naam als de waarde met behulp van deze functie voordat u deze aan de querytekenreeks toevoegt.

Ik heb een moeilijke tijd met het bedenken van redenen om de encodeURI () te gebruiken - ik laat dat over aan de slimmere mensen.


8
2018-01-26 21:31



encodeURIComponent () is de juiste keuze.

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

MAAR je moet in gedachten houden dat er kleine verschillen zijn met de url-code van de php-versie () en zoals gezegd, zal het niet elke teken coderen. Jongens bij http://phpjs.org/functions/urlencode/ gemaakt js gelijk aan 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, '+');
}

7
2017-10-01 08:03



Gelijkaardig soort ding dat ik met normaal javascript heb geprobeerd

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

4
2018-01-05 18:49



Om dubbele codering te voorkomen, is het een goed idee om de URL vóór het coderen te decoderen (als u bijvoorbeeld te maken hebt met door gebruikers ingevoerde URL's, die mogelijk al zijn gecodeerd).

Laten we zeggen dat we hebben abc%20xyz 123 als invoer (één ruimte is al gecodeerd):

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

3
2018-06-22 03:28