Angular

The @authdog/angular SDK integrates Authdog with standalone Angular apps: a DI provider, a signals-based service, an HTTP interceptor, and a route guard. It reads the session Authdog issues and attaches the bearer token to your API calls.

Install

npm install @authdog/angular

Supports Angular ^17–^20 and rxjs ^7.8.

Provide Authdog

Register provideAuthdog with your environment's public key (pk_...) and wire the interceptor into HttpClient:

import { provideHttpClient, withInterceptors } from "@angular/common/http"
import { provideAuthdog, authdogInterceptor } from "@authdog/angular"

export const appConfig: ApplicationConfig = {
  providers: [
    provideRouter(routes),
    provideHttpClient(withInterceptors([authdogInterceptor])),
    provideAuthdog({
      publicKey: environment.authdogPublicKey,
      loginPath: "/",
    }),
  ],
}

authdogInterceptor attaches Authorization: Bearer <token> to outgoing requests. On startup the SDK reads ?token= from the URL, validates the JWT, and persists it to localStorage.

Read the session

AuthdogService exposes Angular signals and sign-in/out methods. publicKey defaults to the value from provideAuthdog:

export class ProfileComponent {
  readonly auth = inject(AuthdogService)

  async ngOnInit() {
    await this.auth.fetchUser()
  }
  // auth.user(), auth.isAuthenticated(), auth.isLoading(), auth.error()
  // auth.signIn(), auth.signUp(), auth.signOut()
}

Guard routes

authdogGuard is a CanActivate guard for gating client routes:

{ path: "profile", component: ProfileComponent, canActivate: [authdogGuard] }

The guard is a UX convenience, not a security boundary — a browser guard can be bypassed. Enforce access on the server with a backend SDK and your authorization model.

Next steps

• Sign up & sign in — the flows signIn/signUp drive.
• Backend requests — the real enforcement point for protected APIs.
• Roles & permissions — the model behind authorization checks.