[Fixed] Remove a parameter from queryParams angular 2

Issue

I navigate to a certain page in my app with a query parameter.
After I get the parameter from the URL I want to delete it, ideally I would have this:

let userToken: string;
    this.sub = this.router
      .routerState
      .queryParams
      .subscribe(params => {
        userToken = params['token'];
        params['token'].remove();
      });

But obviously the remove function doesn’t exist. Does someone have an alternative?

Solution

Just in case people find this thread (like I did). I have the scenario that I receive a JWT token in a query string (/login?jwt=token). I needed to fetch this token (and store it etc), but then needed to make sure that it got safely removed from the URL. Reloading the login route (by using this.router.navigate(['login']) works in principe, however, the user can then use the browser back button, basically replaying the token login.

I solved this by not using the navigate but by DI’ing the ‘Location’ service (from @angular/common). This service has a replaceState method, which completely removes the token from the history as well as from the URL

 this.location.replaceState('login')

Hope that helps someone.

Leave a Reply

(*) Required, Your email will not be published