Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
### ⚠ BREAKING CHANGES

* The SDK api has changed to match changes introduced in V4 version of the agent.
* Response field names follow the JavaScript Agent v4 API. For example, `visitorId` is now `visitor_id`, `requestId` is now `event_id`, and other response fields use snake_case.
* The default caching strategy has changed from `sessionStorage` caching to **no caching by default**, aligned with the underlying [JavaScript agent v4 default](https://docs.fingerprint.com/reference/js-agent-v4-start-function#cache).

### Features
Expand Down
14 changes: 8 additions & 6 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
<a href="https://www.npmjs.com/package/@fingerprint/react"><img src="https://img.shields.io/npm/dm/@fingerprint/react.svg" alt="Monthly downloads from NPM"></a>
<a href="https://opensource.org/licenses/MIT"><img src="https://img.shields.io/:license-mit-blue.svg" alt="MIT license"></a>
<a href="https://discord.gg/39EpE2neBg"><img src="https://img.shields.io/discord/852099967190433792?style=logo&label=Discord&logo=Discord&logoColor=white" alt="Discord server"></a>
<a href="https://fingerprintjs.github.io/react/"><img src="https://img.shields.io/badge/-Documentation-green" alt="Discord server"></a>
<a href="https://fingerprintjs.github.io/react/"><img src="https://img.shields.io/badge/-Documentation-green" alt="Documentation"></a>
</p>

# Fingerprint React
Expand Down Expand Up @@ -42,7 +42,7 @@ Fingerprint is a device intelligence platform offering industry-leading accuracy
- React 18 or higher
- For Preact users: Preact 10.3 or higher
- For Next.js users: Next.js 13.1 or higher
- For Typescript users: Typescript 4.8 or higher
- For TypeScript users: TypeScript 4.8 or higher

> [!NOTE]
> This package assumes you have a Fingerprint subscription or trial, it is not compatible with the [open-source FingerprintJS](https://github.com/fingerprintjs/fingerprintjs). See our documentation to learn more about the [differences between Fingerprint and the open-source FingerprintJS](https://fingerprint.com/github/).
Expand Down Expand Up @@ -76,7 +76,7 @@ To get your API key and get started, see the [Fingerprint Quick Start Guide](htt

- Set `apiKey` to your Fingerprint [Public API Key](https://dashboard.fingerprint.com/api-keys).
- Set `region` if you have chosen a non-global [region](https://docs.fingerprint.com/docs/regions) during registration.
- Set `endpoint` if you are using [one of our proxy integrations to increase accuracy](https://docs.fingerprint.com/docs/protecting-the-javascript-agent-from-adblockers) and effectiveness of visitor identification.
- Set `endpoints` if you are using [one of our proxy integrations to increase accuracy](https://docs.fingerprint.com/docs/protecting-the-javascript-agent-from-adblockers) and effectiveness of visitor identification.
- You can use all the [start options](https://docs.fingerprint.com/reference/js-agent-v4-start-function#start-options) available in the JavaScript agent `start()` function.
- Caching is disabled by default. To enable caching, pass the JavaScript agent [`cache` start option](https://docs.fingerprint.com/reference/js-agent-v4-start-function#cache).

Expand Down Expand Up @@ -114,7 +114,7 @@ function App() {
return <div>Loading...</div>
}
if (error) {
return <div>An error occured: {error.message}</div>
return <div>An error occurred: {error.message}</div>
}

if (isFetched) {
Expand All @@ -133,6 +133,8 @@ The `useVisitorData` hook also returns a `getData` method you can use to make an

Both `useVisitorData` and `getData` accept all the [get options](https://docs.fingerprint.com/reference/get-function#get-options) available in the JavaScript agent `get` function.

The returned v4 visitor data uses raw response field names in snake_case, for example `visitor_id` and `event_id`.

```jsx
// src/App.js
import React, { useState } from 'react'
Expand Down Expand Up @@ -160,7 +162,7 @@ function App() {
.then((data) => {
// Do something with the visitor data, for example,
// append visitor data to the form data to send to your server
console.log(data)
console.log(data.visitor_id)
})
.catch((error) => {
// Handle error
Expand All @@ -187,7 +189,7 @@ export default App

## Linking and tagging information

The `visitorId` provided by Fingerprint Identification is especially useful when combined with information you already know about your users, for example, account IDs, order IDs, etc. To learn more about various applications of the `linkedId` and `tag`, see [Linking and tagging information](https://docs.fingerprint.com/docs/tagging-information).
The visitor ID provided by Fingerprint Identification is especially useful when combined with information you already know about your users, for example, account IDs, order IDs, etc. To learn more about various applications of the `linkedId` and `tag`, see [Linking and tagging information](https://docs.fingerprint.com/docs/tagging-information).

Associate the visitor ID with your data using the `linkedId` or `tag` parameter of the options object passed into the `useVisitorData()` hook or the `getData` function:

Expand Down
Loading