Получение токена OAuth с URL-адреса после обратного вызова URI с помощью Angular

Question

Я перенаправляю свое приложение Angular на Spotify Login (https://accounts.spotify.com/authorize). После входа они перенаправляются обратно на http://localhost: 4200 / callback . К этому URL прикреплен токен. Но он сразу же перенаправляет на (я хочу, чтобы он перенаправил сюда):

const appRoutes: Routes = [{ path: 'callback', redirectTo: '/host', pathMatch: 'full' }]

Как / где я могу сохранить токен аутентификации, не помещая его в URL-адрес пользователя?

Я понимаю, что в конечном итоге мне тоже понадобятся AuthGuards, но сначала я хочу получить токен.

Answer 1

Проверка на автоматическое перенаправление не должна обрабатываться в app.component.ts, и если да, то обрабатывать его через средства защиты, потому что он отвечает за перенаправление.

Тогда

constructor(private route: ActivatedRoute){}
  public ngOnInit():void {
        const token = this.route.snapshot.queryParamMap.get('token');
        // Handle token
        // ...
        this.router.navigate(['./host']);
    }

Answer 2

Я предлагаю вам не устанавливать напрямую "redirectTo" в конфигурации маршрутизации. Вместо этого добавьте callbackComponent для обработки токена и перенаправления. Например:

const appRoutes: Routes = [
    { path: 'callback', component: CallbackComponent }
]

В компоненте обратного вызова

export class CallbackComponent implements OnInit {
    constructor(private route: ActivatedRoute, private router: Router) {}

    public ngOnInit():void {
        const token = this.route.snapshot.queryParamMap.get('token');
        // Handle token
        // ...
        this.router.navigate(['./host']);
    }
}