@knora/authentication NPM

Knora-ui authentication module

This module is part of Knora-ui modules, developed by the team at the Data and Service Center for Humanities DaSCH.

The authentication module contains the login form (for standalone usage) or a complete login- / logout-button environment incl. the login form.

Prerequisites

For help getting started with a new Angular app, check out the Angular CLI.

For existing apps, follow these steps to begin using Knora-ui authentication.

Install

You can use either the npm or yarn command-line tool to install packages. Use whichever is appropriate for your project in the examples below.

Yarn

$ yarn add @knora/authentication

NPM

$ npm install @knora/authentication

Dependencies

This module has the following package dependencies, which you also have to install.

@angular/common@8.0.3
@angular/core@8.0.3
@angular/animations@8.0.3
@angular/cdk@8.1.4
@angular/material@8.1.4
@knora/action@9.5.0
@knora/core@9.5.0
moment@2.22.2

Required version of Knora: 10.0.0

Setup

In your AppModule you have to define the following providers:

import { ErrorInterceptor, JwtInterceptor, KuiAuthenticationModule } from '@knora/authentication';

@NgModule({
    declarations: [
        ...
    ],
    imports: [
        BrowserModule,
        HttpClientModule,
        RouterModule,
        KuiCoreModule.forRoot({
            name: 'Knora-ui Demo App',
            api: environment.api,
            media: environment.media,
            app: environment.app,
        }),
        KuiAuthenticationModule
    ],
    providers: [
        {provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true}
    ]
})
export class AppModule { }

Usage of KuiAuthGuard

The @knora/authentication module contains a guard class which can be used in a restricted app component and will redirect a guest user to the login page. It can be used in the app routing as follow:

import { AuthGuard } from '@knora/authentication';

const appRoutes: Routes = [
    {
        path: '',
        component: AppComponent,
        canActivate: [AuthGuard]
    },
    {
        path: 'login',
        component: LoginFormComponent
    }
]

Usage of kui-login-form

The LoginFormComponent in the app needs in principle only the <kui-login-form></kui-login-form> tag. Additional it's also possible to define e navigation route, where the user will be redirected after successful login: <kui-login-form [navigate]="'/dashboard'"></kui-login-form>