Angular
Using FingerprintJS Pro Angular library
This open-source library provides you with all necessary wrappers for using FingerprintJS Pro with Angular and SSR with Angular Universal.
Sample usage
- Add
@fingerprintjs/fingerprintjs-pro-angular
as a dependency to your application via npm or yarn.
npm install @fingerprintjs/fingerprintjs-pro-angular
yarn add @fingerprintjs/fingerprintjs-pro-angular
- Add
FingerprintjsProAngularModule.forRoot()
to the imports sections in your root application module. You can specify multiple configuration options.
import { NgModule } from '@angular/core'
import { FingerprintjsProAngularModule } from 'fingerprintjs-pro-angular'
// ...
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
FingerprintjsProAngularModule.forRoot({loadOptions: {apiKey: 'public-api-key'}})
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
- Inject the
FingerprintjsProAngularService
in your component's constructor. Now you can identify visitors using thegetVisitorData()
method from the service.
import { Component, OnInit } from '@angular/core';
import { FingerprintjsProAngularService } from 'fingerprintjs-pro-angular';
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
constructor(private fingerprintjsProAngularService: FingerprintjsProAngularService) { }
//^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
visitorId = 'Press "Identify" button to get visitorId';
async onIdentifyButtonClick() : Promise<void> {
const data = await this.fingerprintjsProAngularService.getVisitorData();
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
this.visitorId = data.visitorId;
this.extendedResult = data;
}
}
Documentation
You can find the full documentation in the official GitHub repository. The repository also contains an example app demonstrating usage of the library.
Updated 8 months ago