CODEWITHSUNDEEP
javascriptangulartypescriptspecial-charactersquery-string
Jonty Morris
Jonty Morris

Reputation: 807

Angular 9 how to stop query param encoding

I'm trying to retrieve a long and complex token from the url in my Angular app.

An example url could look like the following (notice the id and token params):

https://localhost:5001/reset?id=e77d8ba0-860e-41ef-9b22-2faa5eb9bcac&token=CfDJ8O1GI7keU8xGn9z9kiO90U9OTQLSPVN0JS00bsu%2FrMuTyaNYuls37zECb0RQk1oHJHJtuWlyFf2K%20ExY%2FWQ9xKUKWkxWQADFDw8fPIc4z%206y55yaIsljI0MPQZOR8BYggN7rQb1e891y3yIiQQJI0kjsvTLcO1NUpH2tt679sdB45x2p1zYPjoRU6ddlMKcxmx6Q538RTB99gek%20YNgiCH73h2pRRWewlcPRfS80G4Ya`

While I can use the Query Param map to retrieve my values, Angular seems to be playing with the data :/

    this.route.queryParamMap.subscribe(
      paramMap => {

        this.token = paramMap.get('token');

        console.log(document.location);
        // ...CfDJ8O1GI7keU8xGn9z9kiO90U9OTQLSPVN0JS00bsu%2FrMuTyaNYuls37zECb0RQk1oHJHJtuWlyFf2K ExY%2FWQ9xKUKWkxWQADFDw8fPIc4z 6y55yaIsljI0MPQZOR8BYggN7rQb1e891y3yIiQQJI0kjsvTLcO1NUpH2tt679sdB45x2p1zYPjoRU6ddlMKcxmx6Q538RTB99gek YNgiCH73h2pRRWewlcPRfS80G4Ya

        console.log(this.token);
        // CfDJ8O1GI7keU8xGn9z9kiO90U9OTQLSPVN0JS00bsu/rMuTyaNYuls37zECb0RQk1oHJHJtuWlyFf2K ExY/WQ9xKUKWkxWQADFDw8fPIc4z 6y55yaIsljI0MPQZOR8BYggN7rQb1e891y3yIiQQJI0kjsvTLcO1NUpH2tt679sdB45x2p1zYPjoRU6ddlMKcxmx6Q538RTB99gek YNgiCH73h2pRRWewlcPRfS80G4Ya 

      });

It seems to be automatically encoding special characters (like turning a %2F into a /). I looked at the Angular.io docs and searched for similar situations, but I just can't figure out how to stop Angular from doing this encoding.

Does anyone know what I'm doing wrong?

Upvotes: 1

Views: 2309

Answers (1)

Shashank Vivek
Shashank Vivek

Reputation: 17494

Try encodeURIComponent 

this.route.queryParamMap.subscribe(
  paramMap => {

    this.token = encodeURIComponent(paramMap.get('token'));

    console.log(this.token);

  });

Upvotes: 2

Related Questions