Skip to main content

Authentication

Default behaviour of an expanded Angular project is to have no authentication. An authentication implementation can be added custom or by using one of the two ready-made options.

Option
angular.basicAuth.enable AngularApp

Enable a basic authorization setup. Uses Basic tokens for the Authorization header. Value is the endpoint that can be used for authentication, e.g. /spaceApp/v1/starships

<options>
<angular.basicAuth.enable>/spaceApp/v1/starships</angular.basicAuth.enable>
</options>

Basic authentication will add a login screen where username and password can be presented. These will be hashed with base64 and used as a basic authentication token for the rest call given with the option. If the rest call succeeds the token will be stored in local storage and used throughout the rest of the application.

Option
angular.oidcAuth.enable AngularApp

Enable an OIDC authorization setup, using Bearer tokens for the Authorization header.

<options>
<angular.oidcAuth.enable/>
</options>

Basic authentication is not very secure, that is why it is better to use an OpenID Connect or oidc solution. The username and password fields are swapped for a simple login button. This button will start the login flow that can be setup with various authentication providers. The angular-auth-oidc-client package is used to add this functionality. When using the angular.oidcAuth.enable option, some required environment variables are expanded in the config files.

These new entries need to be filled in
export interface Config {
baseUrl: string;
// @anchor:properties:start
oidcIssuer: string | undefined;
oidcClientId: string | undefined;
oidcScope: string | undefined;
// @anchor:properties:end
// anchor:custom-properties:start
// anchor:custom-properties:end
}