Remove the hash fragment from url permanently

Question

I use oauth authentication to login user. After the user has logged in, get taken from URL. URL like this: http://xxx/callback#access_token=xxx. then redirect to other page. I use this.router.navigateByUrl to redirect, the hash tag is removed but when I click other link,the hash fragment will show again. How can I remove the hash token fragment permanently?

Example:

after use login in //xxx/callback#access_token=xxx

redirect to //xxx/home

then click linkA, the url is //xxx/linkA#access_token=xxx

expected url is //xxx/linkA

netmikey · Accepted Answer · 2016-10-21 06:59:06Z

Looks like this has been fixed in the Angular 2 final release (testing it with 2.1.0 right now).

The following works for me:

router.navigate([]);

Redirects to the "index" page without the hash and it doesn't reappear on subsequent navigation.

Mahin Khan · Accepted Answer · 2016-12-20 06:28:09Z

You should put useHash equal to false at the imports of your app.module

@NgModule({ bootstrap: [ App ], declarations: [App], imports: [ .... RouterModule.forRoot(ROUTES, { useHash: false }) ], providers: [] })

putting it to false will stop it from using HashLocationStrategy which is the default in RouterModule.forRoot function

longlifelearner · Accepted Answer · 2017-01-03 12:04:50Z

I have same issue, my solution is after retrieved access_token, you can set: window.location.hash = ''

It works for me

Bastien · Accepted Answer · 2020-04-01 13:32:17Z

3

I don't know how you redirect but I assume it's caused by the method you use.

One way to reset the fragment is

<a routerLink="path" fragment="">

(not tested myself yet).

From code

let tree = this.router.navigate(['path'], {relativeTo: this.route, queryParams: ''});

See also https://angular.io/api/router/Router#createurltree

edited Apr 1, 2020 at 13:32

Bastien

6345 silver badges16 bronze badges

answered Aug 5, 2016 at 5:10

Günter Zöchbauer

661k235 gold badges2.1k silver badges1.6k bronze badges

6 Comments

Wenbo Chu Over a year ago

Thanks, just after login redirect, the first url is a OAuth callback url. I redirect by code not by html tag

Wenbo Chu Over a year ago

this works ,<a routerLink="path" [fragment]="['']" /> . but still have the tag #,like xxx/x#

Günter Zöchbauer Over a year ago

Sorry, I somehow mixed it with query parameters. Have you tried [fragment]="[]"?

Wenbo Chu Over a year ago

[fragment]="[]" is the same as [fragment]="['']", you are right. Do you know how can remove the fragment in the router without redirecting and navigating? Is there a method?

Günter Zöchbauer Over a year ago

I guess not. . . .

|

Ced · Accepted Answer · 2017-06-20 10:35:02Z

If you are for example using auth0 in their doc they do :

this.auth0.parseHash({ _idTokenVerification: false }, (err, authResult) => { if (authResult && authResult.accessToken && authResult.idToken) { window.location.hash = ""; } });

Instead do:

this.auth0.parseHash({ _idTokenVerification: false }, (err, authResult) => { if (authResult && authResult.accessToken && authResult.idToken) { this.router.navigate["/home"] } });

This will remove the whole hash

Collectives™ on Stack Overflow

Remove the hash fragment from url permanently

5 Answers 5

Comments

Comments

Comments

6 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

6 Comments

Comments

Linked

Related