@acknow-srl/auth 中文文档教程

Question

Auth

处理 GraphQL 服务器上的身份验证过程。

AckAuthModule (Module)

主要认证模块。

Methods

• forRoot(config: AckAuthConfig): void: configure the connection to the GraphQL server ad the authentication cookie name.

AckCredentials (Interface)

描述用于身份验证的凭据。

• email (string): e-mail address.
• password (string): plain text password.

AckAuthConfig (Interface)

描述认证策略配置。

• server (string): GraphQL server URL.
• store (string): the storage to use. Can be cookie, localstorage (or webstorage) or indexeddb. If not provided or empty, it defaults to cookie. Note: currently, only cookie is supported.
• key (string): the name for the authentication entry. If not provided or empty, it defaults to ack_logged_in.

AckAuthFormField (Interface)

描述身份验证表单字段。

• icon (string): icon for the field. Defaults to an empty string.
• placeholder (string): placeholder for the field. Defaults to an empty string.
• value (string): initial value for the field. Defaults to an empty string.

AckAuthError (Interface)

描述身份验证错误。

• code (string): the authentication error code.
• message (string): the authentication error message.

AckAuth (Service)

它在 root 中提供，因此它对整个应用程序可用。

Methods

• login(credentials: AckCredentials): Observable<string|null>: returns an Observable with the authentication token (and save it in the authentication cookie). If login fails, returns an Observable with an empty string.
• logout(): void: logs out the authenticated user.
• authenticated(): string: returns the authentication token or an empty string.
• isCurrentUserActive(): Observable<boolean>: returns an Observable with true if the authenticated user is active. Otherwise, returns an Observable with false.

AckAuthInterceptor (Interceptor)

仅当存在经过身份验证的用户时，才将带有身份验证令牌的授权标头添加到所有 HTTP(S) 请求中。

AckLoginForm (Component)

显示标准登录表单并管理用户登录。

Selector

确认登录表单

Input

• title (string): title for the login form. Defaults to an empty string.
• email (AckFormField): configuration object for the e-mail field.
• password (AckFormField): configuration object for the password field.
• loginButton (string): label for the login button. Defaults to Login.

Events

• authenticated (string): emitted when the user successfully logs in. It holds the generated token returned by the server.
• error (AckAuthError): emitted when either a server error or an authentication error occurs.

Example

/**
 * 1. Import the module and all classes you need in your main module (usually app.module.ts).
 */

import { AckAuthModule, AckAuthConfig, AckAuthInterceptor } from '@acknow-srl/auth';

/**
 * 2. Add the module to your app imports and configure it.
 *
 * You can also provide the `AckAuthInterceptor` to automatically add the `Authorization` header
 * with the authentication token to all HTTP(S) requests (see the providers section below).
 */

 import { HTTP_INTERCEPTORS } from '@angular/common/http';

 const conf: AckAuthConfig = {
     server: 'http://my-graphql-server-url',

     // Set a different cookie name if SSL is active to prevent attacks.
     cookie: (location.protocol==='https')? 'secure_auth_cookie' : 'auth_cookie';
 };

@NgModule({
  declarations: [
    AppComponent
    ...
  ],
  imports: [
    ...
    AckAuthModule.forRoot(conf),
    ...
  ],
  providers: [
      {provide: HTTP_INTERCEPTORS, useClass: AckAuthInterceptor, multi: true}
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
}

/**
 * 3. You can use the AckAuth service in your components, services and/or guards.
 *
 * In this example, we implement an authentication guard to redirect unauthorized users to the login page.
 */

import { Injectable } from '@angular/core';

import { Router, CanActivate } from '@angular/router';

import { AckAuth } from '@acknow-srl/auth';

@Injectable({
    providedIn: 'root'
})
export class AuthGuard implements CanActivate {

  constructor(private Router: Router, private AckAuth: AckAuth) {
  }

  canActivate() {

    // User is logged in: return true.
    if (this.AckAuth.authenticated()) return true;

    // User is not logged in: redirect to the login page.
    this.Router.navigate(['/login']);
    return false;

  }

}