Angular Device Fingerprinting with a Prynt Service

Angular’s dependency injection is built for exactly this kind of cross-cutting concern: a single service that any component can ask for a device signal. Adding device intelligence gives your app a stable visitor ID and a bot score so you can separate real users from automation.

This guide wraps Prynt in an injectable service, exposes identification as a promise, and verifies the result server-side before it influences any decision. The same service works in an auth guard, an HTTP interceptor, or a checkout component, so you write the integration once and reuse it wherever a decision needs a device signal.

Wrap the agent in a root service

A root-provided service loads the agent once for the whole app. Components inject it instead of touching the SDK directly.

import { Injectable } from '@angular/core'
import Prynt from '@prynt/js'

@Injectable({ providedIn: 'root' })
export class PryntService {
  private agent: any

  async init() {
    this.agent = await Prynt.load({
      apiKey: environment.pryntKey,
      endpoint: 'https://api.pryntid.com'
    })
  }

  async identify(): Promise<string> {
    const result = await this.agent.identify()
    return result.requestId
  }
}

Call init() once from your root component’s ngOnInit or an APP_INITIALIZER. Loading is asynchronous, so it never blocks the first render.

Identify at decision points

Inject the service where a decision happens, not everywhere. A login component asks for the requestId on submit and sends it with the credentials.

export class LoginComponent {
  constructor(private prynt: PryntService, private http: HttpClient) {}

  async onSubmit(form: any) {
    const pryntId = await this.prynt.identify()
    this.http.post('/api/login', { ...form, pryntId })
      .subscribe(res => { /* handle result */ })
  }
}

The component collects the signal; it never decides on it. That happens on the server.

Verify the event on your backend

Look the event up with your secret key and branch on the confidence score and bot result. This is the only trustworthy source.

// Node backend
const res = await fetch(
  `https://api.pryntid.com/v1/events/${pryntId}`,
  { headers: { Authorization: `Bearer ${process.env.PRYNT_SECRET}` } }
)
const event = await res.json()
if (event.confidence < 0.5) {
  return res.status(401).send({ error: 'step-up required' })
}

Store event.visitorId against the account so repeated devices behind different logins become visible. The complete field reference is in the server-side verification docs.

A common mistake is to verify once at login and never again. Instead, treat the visitor ID as a session-long attribute: attach it to sensitive actions like password changes or payouts and re-check the score at each one. An account can be legitimate at sign-in and compromised an hour later, and the device signal is often the first place that shift shows up. An Angular HTTP interceptor is a clean place to attach the latest event ID to outbound requests without touching every component.

Guard forms directly

For signup or contact forms, let Form Shield watch the element and add behavioral signals for scripted fills.

const form = document.querySelector('#signup') as HTMLFormElement
this.agent.protectForm(form, {
  autoGuard: true,
  expectedScripts: ['latin']
})

expectedScripts flags submissions in unexpected writing systems, a low-cost spam signal for Latin-script audiences. It pairs well with server verification: one watches behavior, the other confirms identity.

Branch on the score, do not just block

Use the score to route users: clean sessions pass, borderline ones get a challenge or verification email. Because Prynt runs as a managed cloud service, geolocation, ASN, proxy, and bot detection all arrive without infrastructure on your side, and the free tier covers early traffic while you validate the integration.

Provision a key, add the service, and wire verification into your API. See the pricing and free plan to get started, and your Angular app will have dependable device signals feeding every sensitive flow.