# Fingerprint Pro React Native
[Fingerprint](https://fingerprint.com/) 是一个提供行业领先准确性的设备智能平台。
Fingerprint Pro React Native SDK 是一种将 Fingerprint Pro 集成到您的 React Native 应用程序中的简便方法，它可以调用原生 Fingerprint Pro 库（Android 和 iOS）并识别设备。
## 目录
- [Fingerprint Pro React Native](#fingerprint-pro-react-native)
- [目录](#table-of-contents)
- [要求与限制](#requirements-and-limitations)
- [依赖项](#dependencies)
- [如何安装](#how-to-install)
- [Expo 设置](#expo-setup)
- [1. 添加配置插件](#1-add-config-plugin)
- [2. 重建原生代码](#2-rebuild-the-native-code)
- [3. 重建应用程序](#3-rebuild-the-app)
- [Bare react-native 设置](#bare-react-native-setup)
- [1. 配置 iOS 依赖项（如果在 iOS 上开发）](#1-configure-ios-dependencies-if-developing-on-ios)
- [2. 配置 Android 依赖项（如果在 Android 上开发）](#2-configure-android-dependencies-if-developing-on-android)
- [Gradle 7 或更新版本](#gradle-7-or-newer)
- [Gradle 6.0 或更旧版本](#gradle-60-or-older)
- [用法](#usage)
- [Hooks 方式](#hooks-approach)
- [API Client 方式](#api-client-approach)
- [`extendedResponseFormat`](#extendedresponseformat)
- [关联和标记信息](#linking-and-tagging-information)
- [API 参考](#api-reference)
- [其他资源](#additional-resources)
- [支持与反馈](#support-and-feedback)
- [许可证](#license)
## 要求与限制
- 支持 React Native 0.73 到 0.81 版本
- 支持 Expo 51.0.0 或更高版本
- Android 6.0（API 级别 23+）或更高版本
- iOS 13+/tvOS 15+, Swift 5.9 或更高版本（稳定版本）
- 目前不支持 Fingerprint Pro [请求过滤](https://dev.fingerprint.com/docs/request-filtering)。无法使用允许和禁止的来源。
- 目前不支持在 [Expo environment](https://docs.expo.dev) 内部使用。
## 依赖项
- [Fingerprint Pro iOS](https://github.com/fingerprintjs/fingerprintjs-pro-ios)
- [Fingerprint Pro Android](https://github.com/fingerprintjs/fingerprintjs-pro-android)
## 如何安装
使用您喜欢的包管理器安装该包：
- [NPM](https://npmjs.org):
npm install @fingerprintjs/fingerprintjs-pro-react-native --save
- [Yarn](https://yarnpkg.com):
yarn add @fingerprintjs/fingerprintjs-pro-react-native
- [PNPM](https://pnpm.js.org):
pnpm add @fingerprintjs/fingerprintjs-pro-react-native
## Expo 设置
Web 支持
要在 Web 上使用该 SDK，请使用您首选的包管理器安装对等依赖：
- [NPM](https://npmjs.org):
npm install @fingerprintjs/fingerprintjs-pro-spa --save
- [Yarn](https://yarnpkg.com):
yarn add @fingerprintjs/fingerprintjs-pro-spa
- [PNPM](https://pnpm.js.org):
pnpm add @fingerprintjs/fingerprintjs-pro-spa
然后，像使用原生版本一样使用该 SDK。
### 1. 添加配置插件
```
{
"expo": {
"plugins": [
"@fingerprintjs/fingerprintjs-pro-react-native"
]
}
}
```
### 2. 重建原生代码
```
npx expo prebuild --clean
```
### 3. 重建应用程序
对于 Android：
```
npx expo run:android
```
对于 iOS：
```
npx expo run:ios
```
## Bare react-native 设置
### 1. 配置 iOS 依赖项（如果在 iOS 上开发）
```
cd ios && pod install
```
### 2. 配置 Android 依赖项（如果在 Android 上开发）
将存储库添加到您的 Gradle 配置文件中。这些添加的位置取决于您的项目结构和您使用的 Gradle 版本：
#### Gradle 7 或更新版本
对于 Gradle 7.0 及更高版本（如果您采用了[新的 Gradle 设置文件方法](https://developer.android.com/build#settings-file）），您可能在 `{rootDir}/android/settings.gradle` 的 `dependencyResolutionManagement` 块中管理存储库。请在此块中添加 Maven 存储库：
```
dependencyResolutionManagement {
repositoriesMode.set(RepositoriesMode.PREFER_SETTINGS)
repositories {
google()
mavenCentral()
maven {
url("https://maven.fpregistry.io/releases") // Add this
}
}
}
```
#### Gradle 6.0 或更旧版本
对于 7.0 之前的 Gradle 版本，您的 `{rootDir}/android/build.gradle` 中可能有一个 `allprojects` 块。请在此块中添加 Maven 存储库：
```
allprojects {
repositories {
mavenCentral()
mavenLocal()
maven {
// All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
url("$rootDir/../node_modules/react-native/android")
}
maven {
// Android JSC is installed from npm
url("$rootDir/../node_modules/jsc-android/dist")
}
maven {
url("https://maven.fpregistry.io/releases") // Add this
}
google()
}
}
```
## 用法
要识别访问者，您需要一个 Fingerprint Pro 账户（您可以[免费注册](https://dashboard.fingerprint.com/signup/））。
- 前往 [Fingerprint Pro 仪表板](https://dashboard.fingerprint.com/)。
- 打开 **App Settings** > **API Keys** 以查找您的 Public API key。
### Hooks 方式
通过将您的应用程序包装在 FingerprintJsProProvider 中来配置 SDK。
```
// src/index.js
import React from 'react';
import { AppRegistry } from 'react-native';
import { FingerprintJsProProvider } from '@fingerprintjs/fingerprintjs-pro-react-native';
import App from './App';
import { name as appName } from './app.json';
const WrappedApp = () => (
)
AppRegistry.registerComponent(appName, () => WrappedApp);
```
在您的组件中使用 `useVisitorData` hook 执行访问者识别并获取数据。
```
// src/App.js
import React from 'react'
import {Button, SafeAreaView, Text, View} from 'react-native'
import {useVisitorData} from '@fingerprintjs/fingerprintjs-pro-react-native'
export default function App() {
const {isLoading, error, data, getData} = useVisitorData()
return (
)
}
```
### API Client 方式
```
import React, { useEffect } from 'react';
import { FingerprintJsProAgent } from '@fingerprintjs/fingerprintjs-pro-react-native';
// ...
useEffect(() => {
async function getVisitorInfo() {
try {
const FingerprintClient = new FingerprintJsProAgent({ apiKey: 'PUBLIC_API_KEY', region: 'eu' }); // Region may be 'us', 'eu', or 'ap'
const visitorId = await FingerprintClient.getVisitorId(); // Use this method if you need only visitorId
const visitorData = await FingerprintClient.getVisitorData(); // Use this method if you need additional information about visitor
// use visitor data in your code
} catch (e) {
console.error('Error: ', e);
}
}
getVisitorInfo();
}, []);
```
### `extendedResponseFormat`
支持两种类型的响应："default" 和 "extended"。您不需要传递任何参数即可获得 "default" 响应。
"Extended" 是一种扩展的结果格式，包括地理位置、隐身模式和其他信息。
可以使用 `extendedResponseFormat`: true 参数来请求它。有关响应的更多详细信息，请参阅[文档](https://dev.fingerprint.com/reference/get-function#extendedresult)。
使用 hooks 提供 `extendedResponseFormat`：
```
return (
)
```
使用 API Client 提供 `extendedResponseFormat`：
```
const FingerprintClient = new FingerprintJsProAgent({
apiKey: 'PUBLIC_API_KEY',
region: 'eu',
extendedResponseFormat: true,
})
```
### 关联和标记信息
由 Fingerprint Identification 提供的 `visitorId` 在与您已知的用户信息（例如，账户 ID、订单 ID 等）结合使用时特别有用。要了解有关 `linkedId` 和 `tag` 的各种应用的更多信息，请参阅 [Linking and tagging information](https://dev.fingerprint.com/docs/tagging-information)。
```
const tag = {
userAction: 'login',
analyticsId: 'UA-5555-1111-1'
};
const linkedId = 'user_1234';
// Using hooks
const { getData } = useVisitorData();
const visitorData = await getData(tag, linkedId);
// Using the client
const FingerprintClient = new FingerprintJsProAgent({ apiKey: 'PUBLIC_API_KEY'});
const visitorId = await FingerprintClient.getVisitorId(tag, linkedId);
const visitor = await FingerprintClient.getVisitorData(tag, linkedId);
```
### Proximity Detection
Proximity detection 是一种仅限移动平台使用的、基于位置的补充信号。
您可以在 [Android SDK 文档](https://dev.fingerprint.com/docs/native-android-integration#proximity-detection-for-android-devices) 或
[iOS SDK 文档](https://dev.fingerprint.com/docs/ios-sdk#using-location-data-for-proximity-detection) 中找到更多信息。
只有当 `allowUseOfLocationData` 选项设置为 `true` 时，Fingerprint SDK 才会收集位置数据。
```
return (
)
```
对于 Android 平台，可以通过将 `locationTimeoutMillisAndroid` 选项设置为所需值来配置位置检索超时。默认情况下，它设置为 5 秒。
SDK 将延迟识别最多到指定的超时时间以收集设备位置。如果无法在指定时间内收集位置信息，识别将继续进行但不包含位置信息。
```
return (
)
```
## API 参考
查看完整的 [生成的 API 参考](https://fingerprintjs.github.io/fingerprintjs-pro-react-native/)。
## 其他资源
- [Server-to-Server API](https://dev.fingerprint.com/docs/server-api)
- [Fingerprint Pro 文档](https://dev.fingerprint.com/docs)
## 支持与反馈
要报告问题、提问或提供反馈，请
使用 [Issues](https://github.com/fingerprintjs/fingerprintjs-pro-react-native/issues)。如果您需要私人支持，
请发送电子邮件至 `oss-support@fingerprint.com`。
## 许可证
本项目根据 [MIT 许可证](https://github.com/fingerprintjs/fingerprintjs-pro-react-native/blob/main/LICENSE) 授权。
