Angular

Framework SDK

Module, service injection, and RxJS Observables for LRDefender in Angular apps.

terminal

npm install @lightningresearch/angular @lightningresearch/sdk @angular/core @angular/common rxjs

LRDefenderModule.forRoot()

app.module.ts

import { LRDefenderModule } from '@lightningresearch/angular';

@NgModule({
  imports: [
    LRDefenderModule.forRoot({
      apiKey: environment.lrApiKey,
      region: 'auto',
    }),
  ],
})
export class AppModule {}

LRDefenderService

Inject LRDefenderService in any component or service. All Observable-returning methods include browser guards.

Method

Returns

Description

identify(opts?)

Observable<IdentifyResponse>

Identify current browser device

detectBot()

Observable<BotDetectionResponse>

Run bot detection

assessThreat(ip?)

Observable<ThreatAssessmentResponse>

Assess IP or client network

getDevice(id)

Observable<DeviceResponse>

Look up device by ID

setConsent(granted)

void

Grant or revoke consent

hasConsent()

boolean

Check consent status

device.component.ts

import { Component, inject, OnInit } from '@angular/core';
import { LRDefenderService } from '@lightningresearch/angular';

@Component({
  selector: 'app-device',
  template: `
    <p *ngIf="loading">Identifying…</p>
    <p *ngIf="deviceId">Device: {{ deviceId }}</p>
    <p *ngIf="botScore !== null">Bot score: {{ botScore }}</p>
  `,
})
export class DeviceComponent implements OnInit {
  private lr = inject(LRDefenderService);
  deviceId = '';
  botScore: number | null = null;
  loading = true;

  ngOnInit() {
    this.lr.identify({ tag: 'login' }).subscribe({
      next: (result) => {
        this.deviceId = result.deviceId;
        this.loading = false;
      },
      error: (err) => console.error(err),
    });

    this.lr.detectBot().subscribe({
      next: (bot) => { this.botScore = bot.botScore; },
    });

    this.lr.assessThreat().subscribe({
      next: (threat) => console.log(threat.threatScore, threat.isVpn),
    });
  }
}

Angular Universal SSR

The service uses isPlatformBrowser internally. Calls made during server-side rendering throw or no-op — always gate client-only identification behind a platform check, or defer to AfterViewInit in the browser.

ssr.component.ts

// Angular Universal: LRDefenderService guards all API calls with isPlatformBrowser.
// Server-rendered HTML will not include device IDs — hydrate on the client:

@Component({ /* … */ })
export class DeviceComponent implements OnInit {
  private lr = inject(LRDefenderService);
  private platformId = inject(PLATFORM_ID);

  ngOnInit() {
    if (!isPlatformBrowser(this.platformId)) return;

    this.lr.identify().subscribe({
      next: (r) => { this.deviceId = r.deviceId; },
      error: (err) => {
        // Expected on SSR if called without guard — prefer isPlatformBrowser check
        console.error(err);
      },
    });
  }
}

// For server-side fraud checks, use the Server API from your NestJS/Express backend instead.