Giter VIP home page Giter VIP logo

clientjs's Introduction

ClientJS logo

Device information and digital fingerprinting written in pure JavaScript.

Sauce Test Status Build Status Aircover Coverage

Sauce Test Status

ClientJS is a JavaScript library that makes digital fingerprinting easy, while also exposing all the browser data-points used in generating fingerprints.

If you want to fingerprint browsers, you are probably also interested in other client-based information, such as screen resolution, operating system, browser type, device type, and much more.

Below are some features that make ClientJS different from other fingerprinting libraries:

  • It's pure native JavaScript
  • It's decently lightweight at ~55 KB (full bundle) or ~28 KB (minimal bundle)
  • All user data points are available by design, not just the 32bit integer fingerprint

Installation

To use ClientJS, simply include dist/client.base.min.js or one of the other bundles (see bundles section for more details)

npm

npm install clientjs

Fingerprinting

Digital fingerprints are based on device/browser settings. They allow you to make an "educated guess" about the identify of a new or returning visitor. By taking multiple data points, combining them, and representing them as a number, you can be surprisingly accurate at recognizing not only browsers and devices, but also individual users.

This is useful for identifying users or devices without cookies or sessions. It is not a full proof technique, but it has been shown to be statistically significant at accurately identifying devices.

First, you'll need to import the library. You can do it in different ways, depending on your environment:

// in an ES6 environment:
import { ClientJS } from 'clientjs';

// via CommonJS imports:
const { ClientJS } = require('clientjs');

// in a browser, when using a script tag:
const ClientJS = window.ClientJS;

After having imported the library, simply create a new ClientJS object and call the getFingerprint() method which will return the browser/device fingerprint as a 32bit integer hash ID.

// Create a new ClientJS object
const client = new ClientJS();

// Get the client's fingerprint id
const fingerprint = client.getFingerprint();

// Print the 32bit hash id to the console
console.log(fingerprint);

The current data-points that used to generate fingerprint 32bit integer hash ID is listed below:

  • user agent
  • screen print
  • color depth
  • current resolution
  • available resolution
  • device XDPI
  • device YDPI
  • plugin list
  • font list
  • local storage
  • session storage
  • timezone
  • language
  • system language
  • cookies
  • canvas print

Bundles

For maximum flexibility, this library is distributed in 4 different pre-bundled variants for the browser:

  • dist/client.min.js - full distribution bundle, contains Flash and Java detection mechanisms
  • dist/client.flash.min.js - contains Flash detection mechanism but misses Java detection (getJavaVersion() will throw an error when called)
  • dist/client.java.min.js - contains Java detection mechanism but misses Flash detection (getFlashVersion() will throw an error when called)
  • dist/client.base.min.js - misses both, Flash and Java detection mechanisms (getFlashVersion() and getJavaVersion() will throw an error when called)

Available Methods

Below is the current list of available methods to find information on a users browser/device.

You can find documentation on each method at clientjs.org.

const client = new ClientJS();

client.getBrowserData();
client.getFingerprint();
client.getCustomFingerprint(...);

client.getUserAgent();
client.getUserAgentLowerCase();

client.getBrowser();
client.getBrowserVersion();
client.getBrowserMajorVersion();
client.isIE();
client.isChrome();
client.isFirefox();
client.isSafari();
client.isOpera();

client.getEngine();
client.getEngineVersion();

client.getOS();
client.getOSVersion();
client.isWindows();
client.isMac();
client.isLinux();
client.isUbuntu();
client.isSolaris();

client.getDevice();
client.getDeviceType();
client.getDeviceVendor();

client.getCPU();

client.isMobile();
client.isMobileMajor();
client.isMobileAndroid();
client.isMobileOpera();
client.isMobileWindows();
client.isMobileBlackBerry();

client.isMobileIOS();
client.isIphone();
client.isIpad();
client.isIpod();

client.getScreenPrint();
client.getColorDepth();
client.getCurrentResolution();
client.getAvailableResolution();
client.getDeviceXDPI();
client.getDeviceYDPI();

client.getPlugins();
client.isJava();
client.getJavaVersion(); // functional only in java and full builds, throws an error otherwise
client.isFlash();
client.getFlashVersion(); // functional only in flash and full builds, throws an error otherwise
client.isSilverlight();
client.getSilverlightVersion();

client.getMimeTypes();
client.isMimeTypes();

client.isFont();
client.getFonts();

client.isLocalStorage();
client.isSessionStorage();
client.isCookie();

client.getTimeZone();

client.getLanguage();
client.getSystemLanguage();

client.isCanvas();
client.getCanvasPrint();

Shoulders of Giants

It is important to note this project owes much to other pieces great works. We had the advantage of observing how others had approached this problem.

Built Upon:

Contributing

Collaborate by forking this project and sending a Pull Request this way.

Once cloned, install all dependencies. ClientJS uses Karma as its testing environment.

# Install dependencies
$ npm install

Run Karma and enjoy coding!

$ npm test

Thanks for contributing to ClientJS! Please report any bug here.

Releasing

To make a new release, use the release-it tool, this will guide you through the release process:

npx release-it

You can make a dry run of the release process with the following command:

npx release-it --dry-run

LICENSE

Apache License 2.0

clientjs's People

Contributors

alexeystadnikov-okta avatar bajb avatar bendingbender avatar bilalyasar avatar dependabot[bot] avatar dsmontoya avatar gitter-badger avatar hom3chuk avatar jackspirou avatar julionc avatar nickarnold avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

clientjs's Issues

Undefined user agent

On getFingerprint:

var userAgent = browserData.ua;

this get undefined. Should be changed to:

var userAgent = browserData().ua;

getDeviceFingerprint

Do you think it would be possible to generate a device fingerprint (i.e. excluding browser info) that is meaningful? You'd obviously have a much lower likelihood of uniqueness for the ID.

The use case is providing signals to contribute to some anti-gaming analytics. We know that some users switch browsers and try to up-vote themselves with different accounts.

If you think this is worth adding would you like to see "device" and "browser" provided to the getFingerprint function or a separate getDeviceFingerprint function.

Is there anything we should consider if we wanted to take a shot and submit a pull request?

Publish to npm

Have use considered publishing ClientJS to npm? As per npm's blog, it is totally acceptable for a package to be solely client side. Npm repo is supported by tools other than Bower. For example, jspm is an alternative to Bower and can resolve packages from npm repo.

getCustomFingerprint doesn't calculate last parameter

so, if i try to calculate like

getCustomFingerprint('dfds')

result will be the same for any string, but if do something like

getCustomFingerprint('dfds', '')

then it will actually work fine for first parameter, but last one can be anything and result will not change

Make the library ES6 compatible

Hi,

I've tried to import the library to my application import ClientJS from 'clientjs'; and got an error
TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them here

using babel-loader v6.2.5, webpack v1.13.0, clientjs v0.1.11

After some reading I've come to conclusion that the core reason of the problem is that ES6 modules are automatically strict-mode code. (arguments.callee is forbidden to use in strict mode).

My assumption how to fix it: to update swfobject tool to the latest version where the problem won't exist.

Do you think it's all right to do it ? or Am I missing something that doesn't require this fix?

Thanks in advance.

blackberry compatibility

when checking in the blackberry 10 browser the unique code changes even without deleting cookies or going into private mode. just by refreshing the page.

Using clientjs in cordova app

Hi,

I'm trying to get clientjs to run in my cordova app. But getFingerprint() is undefined and only the following methods are available:

getBrowser: function()

getCPU: function()

getDevice: function()

getEngine: function()

getOS: function()

getResult: function()

getUA: function()

setUA: function(a)

App with Phonegap get different fingerprint every time

Hi!

I'm making an app for iPhone using Phonegap and I liked your library so I wanted to use it to identify people and remember their logins.

The problem is that every time I run the app it gets me different fingerprints. I haven't done anything weird, on XCode I run the app and gives me a value. I stop it, run it again and it gives me a different value.

Thanks!

Firefox error when clientjs is ran in an iframe with a different domain

You can test with this page, but don't host it on clientjs.org

<!doctype html>
<html lang="fr">
    <head>
        <meta charset="utf-8">
        <title>Test fingerprint iframe</title>
    </head>
    <body>
        <iframe width="800" height="400" src="http://clientjs.org"></iframe>
    </body>
</html>

The Firefox javascript console displays this error

Error: Permission denied to access property "href"

The problem is in swfobject src/vendor/swfobject.js. Inverting lines 195 and 196 fixes the issue.

Swfobject project seems no longer active, so I post the issue here.

  • Jibriss

Remove after usage

Is it not possible to remove objects like java and Flash after tests? I can access over the id and remove it. But i tink it´s better to remove it on default by clientJS

Blocked Java will show 200x200px object

pcs61lv

document.getElementById('deployJavaPlugin').style.display = 'none';

this will hidde the object.
The width="0" height="0" from object will be overwritten by chrome´s css (using FireFox)
chrome://pluginproblem/content/pluginProblemContent.css

Flash Plugin warning

I get this appear in chrome:

screen shot 2017-02-15 at 15 27 22

I am using clientjs to get the browser information (i dont particularly care about if they have flash enabled) Is there anything I can do stop this appearing (doesnt look good to the users)?

Browser: Chrome
Version: 56
OS: MacOS Sierra 10.12.3

Use release tags

It would be nice to have release tags with names equal to version (according to semver). A lot of projects do that (e.g. Backbone). Some tools like jspm can benefit from such tags.

Minimal example does not work

I'm trying to use it in minimal html that looks like this

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://clientjs.org/js/client.min.js"></script>
</head>
<script>
    var client = new ClientJS(); // Create A New Client Object
    var fingerprint = client.getFingerprint(); // Calculate Device/Browser Fingerprint
    alert( fingerprint );
</script>
<body>
test
</body>
</html>

In Chrome console I see error

Uncaught TypeError: Cannot read property 'appendChild' of undefined       client.min.js:24

What am I missing ?

Plugins value not consistent using the same browser

The plugins value seems to order the plugins inconsistently when I use the same browser, which results in a different fingerprint:

image

So the plugins listed is consistent, but when they are ordered differently (for some reason), I get a new fingerprint value?

Source File Size Issue

Minified version is of more size than actual. Minified is 44.7 KB and Normal is 25.1 KB

Ubuntu font bug

I don't analyze why, but on some servers fingerprint id is different for SAME browser. Problem is Ubuntu font in function getFonts, sometimes was added to existing fonts, sometimes not. Please remove this font.

older IEs and canvas methods

canvas methods do not fail gracefully for IE versions 8 and below (and perhaps other browsers).

As a result, client.getFingerprint() will throw an error on these browsers and no fingerprint can be computed.

This can be cleared up by wrapping canvas methods in try/catch blocks, but not sure this is the method jackspirou prefers. If so, I can submit a pull request.

Version

https://clientjs.org
new ClientJS().getSoftwareVersion()
"ClientJS 0.1.9"

Oficial Release
new ClientJS().getSoftwareVersion()
"ClientJS 0.1.5"

They are generating different fingerprints

:(

Modular approach

45 Kb in total is huge amount as for me for just fingerprinting..

Is there any way to build client.js with only necessary features?
E.g. if I need only parsing user agent, OS and - include only this in result?

Or, maybe, just import necessary features and leave dead code elimination to webpack or other build system...

Karma Error

Hi guys

I am getting Chrome 58.0.3029 (Mac OS X 10.12.4): Executed 0 of 0 ERROR (0.006 secs / 0 secs) error when starting my karma, not sure why because I am starting it in the right directory. Any help!
screen shot 2017-05-04 at 12 54 01 pm

Error on initilization

Hi Team,

<title> Finger Print Test</title> <script type="text/javascript" src="https://rawgit.com/jackspirou/clientjs/master/dist/client.min.js"></script> <script> var client = new ClientJS(); console.log("clientjs>>>>>>", client); </script> for above code am getting below error, please let me am I missed any thing. Waiting for reply.

client.min.js:39 Uncaught TypeError: Cannot read property 'appendChild' of undefined

Client doesn't return any device details

    var UA = new ClientJS();
var ua = UA.getBrowserData().ua;
var canvasPrint = UA.getCanvasPrint();
return {
    "device_type": UA.getDevice(),                        //returns undefined
    "model": UA.getDeviceType(),                          //returns undefined
    "manufacturer": UA.getDeviceVendor(),           //returns undefined 
    'fingerprint':UA.getCustomFingerprint(ua, canvasPrint)
}

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.