0.0.1 • Published 4 years ago

@yeiniel/angular-auth0 v0.0.1

Weekly downloads
-
License
MIT
Repository
-
Last release
4 years ago

AngularAuth0

AngularAuth0 is an Angular module that provides authentication using Auth0.

Installation

The module can be installed using the following command:

npm install @yeiniel/angular-auth0 --save

Usage

Once the module has been installed you can add it as a dependency of the app module as follows:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { Auth0Module } from '@yeiniel/ngrx-auth0';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,

    Auth0Module.forRoot({
      domain: 'xxxx.auth0.com',
      client_id: 'yyyyyyyy',
      redirect_uri: `${window.location.origin}`
    })
  ],
  providers: [],
  bootstrap: [...]
})
export class AppModule { }

Once the application has been configured to use the module you can start using the service provided to interact with Auth0 (Auth0Service).

The following code is an example of a component that implement the UI used to interact with the module features:

import { Component, OnInit } from '@angular/core';
import { Location } from '@angular/common';
import { Auth0Service } from '@yeiniel/angular-auth0';

@Component({
  selector: 'app-login-logout',
  template: `
  <ng-container [ngSwitch]="isAuthenticated">
    <button *ngSwitchCase="false" (click)="auth0Service.login({ target: location.path(true) })">login</button>
    <button *ngSwitchCase="true" (click)="auth0Service.logout()">logout</button>
  </ng-container>
  `,
  styleUrls: ['./login-logout.component.scss']
})
export class LoginLogoutComponent implements OnInit {

  public isAuthenticated = false;

  constructor(public location: Location, public auth0Service: Auth0Service) { }

  ngOnInit(): void {
    this.auth0Service.isAuthenticated$.subscribe(
      isAuthenticated => {
        this.isAuthenticated = isAuthenticated;
      }
    );
  }
}