node_js_ipqs_device_tracker - npm Package Compare versions

Comparing version 1.0.2 to 1.0.3

package.json

 {
   "name": "node_js_ipqs_device_tracker",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "NodeJS/React package to interface with the IPQS Device Fingerprint API.",
@@ -16,3 +16,3 @@ "types": "./lib/cjs/types/index.d.ts",
   "author": "IPQualityScore LLC",
-  "license": "ISC",
+  "license": "MIT",
   "files": [
@@ -19,0 +19,0 @@ "lib/**/*"

README.md

 # NPM Device Fingerprint Tracker Package for React
 
-This is the NPM/Yarn package for implementing the Device Fingerprint Tracker API in React
+IPQS combines our advanced industry blacklist fraud data and global threat network with device fingerprinting technologies to offer one of the most advanced anti-fraud tools on the market. The IPQS device fingerprint tracker tracks devices using advanced algorithms while offering websites the ability to safeguard themselves against bot attacks, duplicate account creation, chargeback fraud, and much more.
 
+The IPQS device fingerprint tracker can help:
+
+- Stop account takeover attacks
+- Stop bot clicks
+- Prevent chargebacks
+- Stop fraudulant transactions
+- Prevent affiliate fraud
+
+And much more.
+
+This NPM package is built for JavaScript frameworks SPA tools such as React, Vue, Angular, and more. It’s compatible with both JavaScript and Typescript.
+
 ## Further Reading
 
-* [Creating a Device Fingerprint Tracker](https://www.ipqualityscore.com/user/tracker/new)
-* [Device Fingerprint Overview](https://www.ipqualityscore.com/device-fingerprinting)
-* [Device Fingerprint API](https://www.ipqualityscore.com/documentation/device-fingerprint/overview)
+- [Creating a Device Fingerprint Tracker](https://www.ipqualityscore.com/user/tracker/new)
+- [Device Fingerprint Overview](https://www.ipqualityscore.com/device-fingerprinting)
+- [Device Fingerprint API](https://www.ipqualityscore.com/documentation/device-fingerprint/overview)
 
@@ -17,2 +29,42 @@ ## Installation
 
+First, import the IPQS device fingerprint tracker into your project:
+
+```javascript
+import DeviceFingerprint from "node_js_ipqs_device_tracker";
+```
+
+Next, initialize the device fingerprint tracker in the webapp:
+
+```javascript
+const secretKey = process.env.VUE_APP_IPQS_DT_KEY;
+DeviceFingerprint.initializeScriptAsync(secretKey)
+  .then(async () => {
+    DeviceFingerprint.AfterResult((result) => {
+      save_fingerprint(result);
+      LOGS.log_to_console("Fingerprint", result);
+      // FINGERPRINT.save_fingerprint(result);
+      // return result;
+    });
+    DeviceFingerprint.Init();
+  })
+  .catch((err) => {
+    console.log("DT Error");
+    console.log(err);
+  });
+```
+
+### How To Find The Device Fingerprint Tracker Secret Key
+
+Before integrating the IPQS device fingerprint tracker in the webapp, a device tracker needs to be created in your IPQS account. The secret key for the device fingerprint tracker is tied to the device tracker itself. It does not use your IPQS account's API key.
+
+1. Log in to your IPQS account: [https://www.ipqualityscore.com/login](https://www.ipqualityscore.com/login)
+2. Navigate to the Device Fingerprint Tracking Dashboard from the left-hand navigation bar: [https://www.ipqualityscore.com/user/tracker](https://www.ipqualityscore.com/user/tracker)
+3. (A) If a tracker has not been created yet, click the blue 'Create New Fingerprint Tracker' button to create one first.
+4. (B) Scroll to the bottom of the Device Fingerprint Tracking Dashboard, and find the device tracker that is going to be used in the webapp.
+5. Click on the Red Details button next to the device tracker.
+
+A new page will load with the documentation and JS snippet for the device tracker. The secret key is located in the JS snippet between "https://www.ipqscdn.com/api/*/" and "/learn.js". Copy long alphanumeric string in that URL. This is the device fingerprint tracker secret key.
+
+# React Examples
+
 To initialize the Device Tracker Package in React, you can do it in one of two ways
@@ -23,13 +75,15 @@
 ```javascript
-import DeviceFingerprint from 'ipqs-device-fingerprint-for-react';
+import DeviceFingerprint from "node_js_ipqs_device_tracker";
 
 function App() {
-    const secretKey = `YourSecretKey`;
-    useEffect(() => {
-        DeviceFingerprint.initializeScriptAsync(secretKey).then(() => {
-            DeviceFingerprint.Init();
-        }).catch(() => {
-            // Any errors loading the external script will be caught here
-        });
-    });
+  const secretKey = `YourSecretKey`;
+  useEffect(() => {
+    DeviceFingerprint.initializeScriptAsync(secretKey)
+      .then(() => {
+        DeviceFingerprint.Init();
+      })
+      .catch(() => {
+        // Any errors loading the external script will be caught here
+      });
+  });
 }
@@ -43,18 +97,59 @@ ```
 ```javascript
-import DeviceFingerprint from 'ipqs-device-fingerprint-for-react';
+import DeviceFingerprint from "ipqs-device-fingerprint-for-react";
 
 function App() {
-    useEffect(() => {
-        DeviceFingerprint.initializeScript();
-        setTimeout( function() {
-          DeviceFingerprint.AfterResult(afterResult);
-          DeviceFingerprint.Init();
-        }, 1000);
-    });
+  useEffect(() => {
+    DeviceFingerprint.initializeScript();
+    setTimeout(function () {
+      DeviceFingerprint.AfterResult(afterResult);
+      DeviceFingerprint.Init();
+    }, 1000);
+  });
 }
 ```
 
+# Vue Examples
+
+### Options API
+
+```javascript
+export default {
+  name: "App",
+  components: {
+    NavBar,
+  },
+  setup() {
+    const secretKey = process.env.VUE_APP_IPQS_DT_KEY;
+    DeviceFingerprint.initializeScriptAsync(secretKey)
+      .then(async () => {
+        DeviceFingerprint.AfterResult((result) => {
+          console.log("IPQS Fingerprint: ", result);
+          // ########################################
+          // Handle The Fingerprint Record
+          // ########################################
+          // Best practice is to save the fingerprint results to the Store. The
+          // example below saves the fingerprint results to a Vuex initialized store.
+
+          // this.$store.commit.save_fingerprint(result);
+          // return result;
+        });
+        DeviceFingerprint.Init();
+      })
+      .catch((err) => {
+        console.log("DT Error");
+        console.log(err);
+      });
+  },
+  mounted() {},
+  // created: {},
+  computed: {},
+  watch: {},
+  methods: {},
+};
+</script>
+```
+
 ## Other Methods
 
-**NOTE**: The following methods will only work after `initializeScriptAsync()` or `initializeScriptAsync()` have successfully loaded
+**NOTE**: The following methods will only work after `initializeScriptAsync()` or `initializeScriptAsync()` have successfully loaded in React.
 
@@ -67,7 +162,7 @@ ### Init();
 DeviceFingerprint.initializeScriptAsync(secretKey).then(() => {
-    const callback = (result) => {
-        console.log(result);
-    }
-    DeviceFingerprint.AfterResult(callback);
-    DeviceFingerprint.Init();
+  const callback = (result) => {
+    console.log(result);
+  };
+  DeviceFingerprint.AfterResult(callback);
+  DeviceFingerprint.Init();
 });
@@ -82,7 +177,7 @@ ```
 DeviceFingerprint.initializeScriptAsync(secretKey).then(() => {
-    const callback = (result) => {
-        console.log(result);
-    }
-    DeviceFingerprint.AfterResult(callback);
-    DeviceFingerprint.Init();
+  const callback = (result) => {
+    console.log(result);
+  };
+  DeviceFingerprint.AfterResult(callback);
+  DeviceFingerprint.Init();
 });
@@ -97,7 +192,7 @@ ```
 DeviceFingerprint.initializeScriptAsync(secretKey).then(() => {
-    const callback = (result) => {
-        console.log(result);
-    }
-    DeviceFingerprint.AfterFailure(callback);
-    DeviceFingerprint.Init();
+  const callback = (result) => {
+    console.log(result);
+  };
+  DeviceFingerprint.AfterFailure(callback);
+  DeviceFingerprint.Init();
 });
@@ -112,4 +207,4 @@ ```
 DeviceFingerprint.initializeScriptAsync(secretKey).then(() => {
-    DeviceFingerprint.Init();
-    DeviceFingerprint.Pause();
+  DeviceFingerprint.Init();
+  DeviceFingerprint.Pause();
 });
@@ -124,5 +219,5 @@ ```
 DeviceFingerprint.initializeScriptAsync(secretKey).then(() => {
-    DeviceFingerprint.Init();
-    DeviceFingerprint.Pause();
-    DeviceFingerprint.Resume();
+  DeviceFingerprint.Init();
+  DeviceFingerprint.Pause();
+  DeviceFingerprint.Resume();
 });
@@ -141,8 +236,8 @@ ```
 DeviceFingerprint.initializeScriptAsync(secretKey).then(() => {
-    const formId = "someFormId";
-    const callback = (event) => {
-        event.preventDefault();
-    }
-    DeviceFingerprint.Trigger(`#${formId}`, callback);
-    DeviceFingerprint.Init();
+  const formId = "someFormId";
+  const callback = (event) => {
+    event.preventDefault();
+  };
+  DeviceFingerprint.Trigger(`#${formId}`, callback);
+  DeviceFingerprint.Init();
 });
@@ -152,4 +247,4 @@ ```
 ```html
-<form id={formId}>
-    <button type="submit">Submit</button>
+<form id="{formId}">
+  <button type="submit">Submit</button>
 </form>
@@ -166,11 +261,11 @@ ```
 DeviceFingerprint.initializeScriptAsync(secretKey).then(() => {
-    const prefix = "somePrefix";
-    DeviceFingerprint.SetFormFieldPrepend(prefix);
-    
-    const formId = "someFormId";
-    const callback = (event) => {
-        event.preventDefault();
-    }
-    DeviceFingerprint.Trigger(`#${formId}`, callback);
-    DeviceFingerprint.Init();
+  const prefix = "somePrefix";
+  DeviceFingerprint.SetFormFieldPrepend(prefix);
+
+  const formId = "someFormId";
+  const callback = (event) => {
+    event.preventDefault();
+  };
+  DeviceFingerprint.Trigger(`#${formId}`, callback);
+  DeviceFingerprint.Init();
 });
@@ -180,4 +275,4 @@ ```
 ```html
-<form id={formId}>
-    <button type="submit">Submit</button>
+<form id="{formId}">
+  <button type="submit">Submit</button>
 </form>
@@ -192,7 +287,13 @@ ```
 DeviceFingerprint.initializeScriptAsync(secretKey).then(() => {
-    const fieldName = "someField";
-    const fieldId = "#someFieldId";
-    DeviceFingerprint.Field(fieldName, fieldId);
-    DeviceFingerprint.Init();
+  const fieldName = "someField";
+  const fieldId = "#someFieldId";
+  DeviceFingerprint.Field(fieldName, fieldId);
+  DeviceFingerprint.Init();
 });
 ```
+
+# Need Help?
+
+If you need additional help or would like to schedule a meeting for assistance, open a new help ticket in your [IPQS account](https://www.ipqualityscore.com/user/support/new).
+
+IPQS offers a full white-glove support service for all customers with an enterprise-level subscription. We are always happy to help!

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

29344

increased by15.4%

Number of low license alerts

0

decreased by-100%

Number of lines in readme file

286

increased by53.76%

No dependency changes