CODEWITHSUNDEEP
javascriptangularauthentication
Razvan Zamfir
Razvan Zamfir

Reputation: 4704

How do I execute this redirect based on whether or not authentication takes place in a Angular 9 application?

Im am working on an Angular 9 application that uses OneLogin for authentication purposes.

In the auth.component.ts file I have an authentication service that I use in the authentication component:

import { AuthService } from 'path/to/core/services/auth/auth.service';
import { AuthApiService } from 'path/to/core/core/services/auth/auth-api.service';
import { Component, OnInit } from '@angular/core';
import { authCodeFlowConfig } from 'path/to/config/onelogin-api/config-auth.component';

@Component({
    selector: 'auth',
    templateUrl: './assets/auth.component.html',
    styleUrls: ['./assets/auth.component.scss']
})

export class AuthComponent implements OnInit{
    constructor(private _authService: AuthService) {
    }

    startAuthentication() {
        this._authService.startAuthentication();
    }

    ngOnInit(): void {
        this.startAuthentication();
    }
}

In auth.service.ts I have the startAuthentication() method:

startAuthentication(): Observable<any> {
    const {issuer, redirectUri, clientId, responseType, scope} = authCodeFlowConfig;

    const url = `someURL`;

    this.redirectTo(url);

    return of(false);
}
redirectTo(url: string): void {
    window.location.href = url;
}

In the app.module.ts file I have this array of routes:

import { AuthService } from './core/services/auth/auth.service';
// more imports

const appRoutes: Routes = [
    {
        path      : 'myroute',
        redirectTo: 'myroute'
    },
    {
        path: 'auth',
        component: AuthComponent
    }
];

In other words, I want the application to reach a certain url if login is successful and otherwise redirect to the login form.

What I want to happen is: when login is sucessful - in other words, when startAuthentication() is executed - there should be a redirect to myroute.

I tried {path: 'auth', component: AuthComponent, startAuthentication:[AuthService]} bit it fails.

What am I doing wrong?

Upvotes: 0

Views: 105

Answers (1)

julianobrasil
julianobrasil

Reputation: 9377

As I don't have any further information about your StartAuthentication method, I'd say that you should inject the router service in your component and navigate using it:

import { Router } from '@angular/router';
...

constructor(
  private _authService: AuthService,
  private _router: Router) {}

startAuthentication() {
  this._authService.startAuthentication();
  this._router.navigate(['/', 'myroute']);
}

Upvotes: 2

Related Questions