mirror of https://github.com/IoTcat/fp.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
88 lines
2.9 KiB
88 lines
2.9 KiB
# fp |
|
|
|
[](https://app.fossa.com/projects/git%2Bgithub.com%2FIoTcat%2Ffp?ref=badge_shield) |
|
 |
|
 |
|
 |
|
 |
|
|
|
The simplified usage of [fingerprintjs/fingerprintjs2](https://github.com/fingerprintjs/fingerprintjs2). |
|
|
|
[简体中文](./zh.md) |
|
|
|
|
|
## What is fp? |
|
fp is a concise web front-end solution to generate an unique 'fingerprint' for each visitor basing on visitor's device and browser. fp is the simplified usage of [fingerprintjs/fingerprintjs2](https://github.com/fingerprintjs/fingerprintjs2). Without complex configuration, fp can provide an optimized fingerprint for user-agents in form of 6 letters hash in a short time. |
|
|
|
|
|
## Quick start |
|
|
|
[Click here to see how it works!](https://fp.js.org/demo.html) |
|
|
|
|
|
## How to use fp? |
|
|
|
### Install |
|
|
|
npm: |
|
```bash |
|
$ npm install fp3 --save |
|
``` |
|
|
|
yarn: |
|
```bash |
|
$ yarn add fp3 |
|
``` |
|
|
|
Cite in HTML: |
|
```html |
|
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/fp3/dist/fp.min.js"></script> |
|
``` |
|
|
|
### Generate fp |
|
This is a demo to generate fp: |
|
```html |
|
<script type="text/javascript"> |
|
;(async function(){ |
|
alert(await fp); |
|
})() |
|
</script> |
|
``` |
|
|
|
This will generate a six-letter hash like this (For difficult client this hash is unique): |
|
```bash |
|
df3kd0 |
|
``` |
|
The first two letters `df` indicates the fingerprint of the device, such as the PC, phone etc. Ideally, these two letter will not vary while you switch the browser on the same device. |
|
|
|
The middle two letters `3k` and the last two letters `d0` are the fingerprint of the browser. The different is that, the last one could vary with the change of timezone, plugin etc., while the middle one is more stable and will not vary under these stuation. However, the middle part is more likely to be "not unique" when you have a great amount of clients. |
|
|
|
In practice, you can use `substr()` to decompose fp into each part. |
|
```js |
|
;(async function(){ |
|
var fp_device = (await fp).substr(0, 2); //df in df3kd0 |
|
var fp_browser = (await fp).substr(2, 2); //3k in df3kd0 |
|
var fp_unique = (await fp).substr(4); //d0 in df3kd0 |
|
})() |
|
```` |
|
|
|
|
|
## Advanced Usage |
|
|
|
|
|
### Get fp details |
|
```html |
|
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/fp3/dist/fp.min.js"></script> |
|
<script type="text/javascript"> |
|
;(async function(){ |
|
console.log(await fp_details); |
|
})() |
|
</script> |
|
``` |
|
|
|
## CDN |
|
- jsdelivr: `https://cdn.jsdelivr.net/npm/fp3/dist/fp.min.js` |
|
- China: `https://cdn.yimian.xyz/fp/fp.min.js` |
|
|
|
## License |
|
[](https://app.fossa.io/projects/git%2Bgithub.com%2FIoTcat%2Ffp?ref=badge_large)
|
|
|