Finger Printing to Identify Visitors to Your Site

You must be familiar how Google shows the list of devices you have used to login to their services.

You might also have seen how Stripe does something similar.

Stripe Dashboard

Let's implement it in a Rails app. Add the javascript within the head element in the application layout file.

    <script src="https://cdnjs.cloudflare.com/ajax/libs/fingerprintjs2/1.8.0/fingerprint2.js">
      new Fingerprint2().get(function(result, components) {
        console.log(result) // a hash, representing your device fingerprint
        console.log(components) // an array of FP components
      })  
    </script>

You can now see the values in the browser console:

device fingerprint

You can see the hash: 8693ad6f2f49a559ab88e09ae6f5f1ab. This is unique to the visitor. The screenshot shows all the data that was used to generate this unique fingerprint. You can save these data in the database and show unique devices to the user to automatically log them out of devices they no longer use.

Consistent Fingerprint

In order to generate consistent fingerprint for a given browser we must wait. The github page for the library says 50 milli seconds is good but here I am using a delay of one second.

    <script src="https://cdnjs.cloudflare.com/ajax/libs/fingerprintjs2/1.8.0/fingerprint2.js">
      setTimeout(function() {
        // Wait one second to get consistent fingerprint value
        new Fingerprint2().get(function(result, components) {
          console.log(result) // a hash, representing your device fingerprint
          console.log(components) // an array of FP components
        })  
      }, 1000);      
    </script>

Fingerprinting has many uses besides security and limiting illegal sharing of your paid content. You can use it to develop affiliate tracking software. Of course, you have to make it clear to the visitors what data you are collecting and obey the laws.

Reference

Building a Rails API App - Accept Data from Javascript


Related Articles


Ace the Technical Interview

  • Easily find the gaps in your knowledge
  • Get customized lessons based on where you are
  • Take consistent action everyday
  • Builtin accountability to keep you on track
  • You will solve bigger problems over time
  • Get the job of your dreams

Take the 30 Day Coding Skills Challenge

Gain confidence to attend the interview

No spam ever. Unsubscribe anytime.