ClientJS
Device information and digital fingerprinting written in pure JavaScript.
Overview 
ClientJS is simple. It is for finding device information and generating digital fingerprints.
What Is This?
ClientJS makes use of many different native JavaScript functions, methods, and opensource resources to find information about the client.
ClientJS easily lets you create a client object to find out as much useful information as you can about what devices are connecting to your site and your product. You can ask specific questions like, “does the user have an iOS or Android device?” or better yet, “is the user's device an iPad?” ClientJS even lets you produce browser/device fingerprint IDs.
Why Use It?
Gathering information from different browsers and devices makes it difficult to handle cross compatibility. We take care of the hard stuff so that you can easily get the client info you need.
ClientJS attempts to solve the problem of making client data more easily available. Good data is necessary for good analytics that help you make better business and tech choices. Do you have good informative data about how your users connect to your site? Do you know their average screen size? ClientJS can help you collect data and make good decisions for your application and business.
How To Install It
1) Download. 2) Include. 3) Have Fun!
Step 1. Download
npm
ClientJS is available via npm.
npm install clientjs
bower
ClientJS is available as a bower package.
bower install clientjs
Github
ClientJS is hosted on github.
Just visit our github page at https://github.com/jackspirou/clientjs and download the minified production JavaScript!
Step 2. Include
Just include the 'client.min.js' library in the beginning of your project and you can start testing for mobile devices, installed fonts, calculate browser/device fingerprints, and more!
<!DOCTYPE html>
<html lang="en">
<head>
<script src="client.min.js"></script>
</head>
<body>
...
Step 3. Use it!
How To Use It
After you have ClientJS installed, using it is simple! The first thing you need to do is create a client object and then start calling some methods.
<script>
var client = new ClientJS();
</script>
See how easy that was! Now how about we execute some methods? Let's see if we have a mobile device and if so is it an android or iOS device? If it is not, lets check if Java is installed and its version.
<script>
var client = new ClientJS(); // Create A New Client Object
if( client.isMobile() ) { // Check For Mobile Device
if( client.isMobileAndroid() ) { // Check For Android
alert('We Got Us Some Android!');
}else if( client.isMobileIOS() ){ // Check For iOS
alert('We Got Us Some Apple iOS!');
}else{
alert('Unknown Mobile Device...');
}
}else{
if( client.isJava() ) { // Check If Java Is Installed
alert('Java ' + client.getJavaVersion() ); // Get Java Version
}else{
alert('No Java Installed...');
}
}
</script>
We can can get much more info with ClientJS, but for now lets just calculate our users device/browser fingerprint.
<script>
var client = new ClientJS(); // Create A New Client Object
var fingerprint = client.getFingerprint(); // Calculate Device/Browser Fingerprint
alert( fingerprint );
</script>
Again, these are just a few examples of what you can do with ClientJS. Read about more features below:
ClientJS Methods
You need these ClientJS methods to properly utilizing ClientJS.
new ClientJS()
ClientJS constructor which initiates the data and returns the client object.
<script>
var client = new ClientJS(); // Create A New Client Object
</script>
getSoftwareVersion
Get Software Version. Return a string containing this software version number.
<script>
var client = new ClientJS(); // Create A New Client Object
var softwareVersion = client.getSoftwareVersion(); // Get ClientJS Software Version
console.log( softwareVersion );
</script>
Your Result:
Fingerprint Methods
A device fingerprint or machine fingerprint or browser fingerprint is information collected about a remote computing device for the purpose of identification. Fingerprints can fully or partially identify individual users or devices even when cookies are turned off.
getFingerprint()
Get Fingerprint. Return a 32-bit integer representing the browsers fingerprint.
<script>
var client = new ClientJS(); // Create A New Client Object
var fingerprint = client.getFingerprint(); // Get Client's Fingerprint
console.log( fingerprint );
</script>
Your Result:
getCustomFingerprint()
Get Custom Fingerprint. Take a string of datapoints and return a 32-bit integer representing the browsers fingerprint.
<script>
var client = new ClientJS(); // Create A New Client Object
var ua = client.getBrowserData().ua;
var canvasPrint = client.getCanvasPrint();
var fingerprint = client.getCustomFingerprint(ua, canvasPrint);
console.log( fingerprint );
</script>
Your Result:
UserAgent Methods
A user agent is any software that retrieves and presents Web content for end users or is implemented using Web technologies.
getUserAgent()
Get User Agent. Return a string containing unparsed user agent.
<script>
var client = new ClientJS(); // Create A New Client Object
var userAgent = client.getUserAgent(); // Get User Agent String
console.log( userAgent );
</script>
Your Result:
getUserAgentLowerCase()
Get User Agent Lower Case. Return a lowercase string containing the user agent.
<script>
var client = new ClientJS(); // Create A New Client Object
var userAgentLowerCase = client.getUserAgentLowerCase(); // Get User Agent String
console.log( userAgentLowerCase );
</script>
Your Result:
Browser Methods
Find out the name and version of the client browser.
getBrowser()
Get Browser. Return a string containing the browser name.
<script>
var client = new ClientJS(); // Create A New Client Object
var browser = client.getBrowser(); // Get Browser
console.log( browser );
</script>
Your Result:
getBrowserVersion()
Get Browser Version. Return a string containing the browser version.
<script>
var client = new ClientJS(); // Create A New Client Object
var browserVersion = client.getBrowserVersion(); // Get Browser Version
console.log( browserVersion );
</script>
Your Result:
getBrowserMajorVersion()
Get Browser Major Version. Return a string containing the major browser version.
<script>
var client = new ClientJS(); // Create A New Client Object
var browserMajorVersion = client.getBrowserMajorVersion(); // Get Browser's Major Version
console.log( browserMajorVersion );
</script>
Your Result:
isIE()
Is IE. Check if the browser is IE.
<script>
var client = new ClientJS(); // Create A New Client Object
var isIE = client.isIE(); // Check For IE
console.log( isIE );
</script>
Your Result:
isChrome()
Is Chrome. Check if the browser is Chrome.
<script>
var client = new ClientJS(); // Create A New Client Object
var isChrome = client.isChrome(); // Check For Chrome
console.log( isChrome );
</script>
Your Result:
isFirefox()
Is Firefox. Check if the browser is Firefox.
<script>
var client = new ClientJS(); // Create A New Client Object
var isFirefox = client.isFirefox(); // Check For Firefox
console.log( isFirefox );
</script>
Your Result:
isSafari()
Is Safari. Check if the browser is Safari.
<script>
var client = new ClientJS(); // Create A New Client Object
var isSafari = client.isSafari(); // Check For Safari
console.log( isSafari );
</script>
Your Result:
isOpera()
Is Opera. Check if the browser is Opera.
<script>
var client = new ClientJS(); // Create A New Client Object
var isOpera = client.isOpera(); // Check For Opera
console.log( isOpera );
</script>
Your Result:
isMobileSafari()
Is MobileSafari. Check if the browser is Mobile Safari.
<script>
var client = new ClientJS(); // Create A New Client Object
var isMobileSafari = client.isMobileSafari(); // Check For Mobile Safari
console.log( isMobileSafari );
</script>
Your Result:
Engine Methods
A web browser engine, is a software component that takes marked up content and formatting information and displays the formatted content on the screen.
getEngine()
Get Engine. Return a string containing the browser engine.
<script>
var client = new ClientJS(); // Create A New Client Object
var engine = client.getEngine(); // Get Engine
console.log( engine );
</script>
Your Result:
getEngineVersion()
Get Engine Version. Return a string containing the browser engine version.
<script>
var client = new ClientJS(); // Create A New Client Object
var engineVersion = client.getEngineVersion(); // Get Engine Version
console.log( engineVersion );
</script>
Your Result:
OS Methods
An operating system (OS) is a collection of software that manages computer hardware resources and provides common services for computer programs.
getOS()
Get OS. Return a string containing the OS.
<script>
var client = new ClientJS(); // Create A New Client Object
var OS = client.getOS(); // Get OS Version
console.log( OS );
</script>
Your Result:
getOSVersion()
Get OS Version. Return a string containing the OS Version.
<script>
var client = new ClientJS(); // Create A New Client Object
var osVersion = client.getOSVersion(); // Get OS Version
console.log( osVersion );
</script>
Your Result:
isWindows()
Is Windows. Check if the OS is Windows.
<script>
var client = new ClientJS(); // Create A New Client Object
var isWindows = client.isWindows(); // Check For Windows
console.log( isWindows );
</script>
Your Result:
isMac()
Is Mac. Check if the OS is Mac.
<script>
var client = new ClientJS(); // Create A New Client Object
var isMac = client.isMac(); // Check For Mac
console.log( isMac );
</script>
Your Result:
isLinux()
Is Linux. Check if the OS is Linux.
<script>
var client = new ClientJS(); // Create A New Client Object
var isLinux = client.isLinux(); // Check For Linux
console.log( isLinux );
</script>
Your Result:
isUbuntu()
Is Ubuntu. Check if the OS is Ubuntu.
<script>
var client = new ClientJS(); // Create A New Client Object
var isUbuntu = client.isUbuntu(); // Check For Ubuntu
console.log( isUbuntu );
</script>
Your Result:
isSolaris()
Is Solaris. Check if the OS is Solaris.
<script>
var client = new ClientJS(); // Create A New Client Object
var isSolaris = client.isSolaris(); // Check For Solaris
console.log( isSolaris );
</script>
Your Result:
Device Methods
By Device we mean the user's personal computer. A personal computer (PC) is a general-purpose computer, whose size, capabilities, and original sale price makes it useful for individuals, and which could be a desktop, mobile, tablet, or laptop.
getDevice()
Get Device. Return a string containing the device.
<script>
var client = new ClientJS(); // Create A New Client Object
var device = client.getDevice(); // Get Device
console.log( device );
</script>
Your Result:
getDeviceType()
Get Device Type. Return a string containing the device type.
<script>
var client = new ClientJS(); // Create A New Client Object
var deviceType = client.getDeviceType(); // Get Device Type
console.log( deviceType );
</script>
Your Result:
getDeviceVendor()
Get Device Vendor. Return a string containing the device vendor.
<script>
var client = new ClientJS(); // Create A New Client Object
var deviceVendor = client.getDeviceVendor(); // Get Device Vendor
console.log( deviceVendor );
</script>
Your Result:
CPU Methods
A central processing unit (CPU), also referred to as a central processor unit, is the hardware within a computer that carries out the instructions of a computer program by performing the basic arithmetical, logical, and input/output operations of the system.
getCPU()
Get CPU. Return a string containing the CPU architecture.
<script>
var client = new ClientJS(); // Create A New Client Object
var CPU = client.getCPU(); // Get CPU Architecture
console.log( CPU );
</script>
Your Result:
Mobile Methods
A mobile browser, also called a microbrowser, minibrowser, or wireless internet browser (WIB), is a web browser designed for use on a mobile device such as a mobile phone or PDA. Mobile browsers are optimized so as to display Web content most effectively for small screens on portable devices.
isMobile()
Is Mobile. Check if the browser is on a mobile device.
<script>
var client = new ClientJS(); // Create A New Client Object
var isMobile = client.isMobile(); // Check For Mobile
console.log( isMobile );
</script>
Your Result:
isMobileMajor()
Is Mobile Major. Check if the browser is on a major mobile device.
<script>
var client = new ClientJS(); // Create A New Client Object
var isMobileMajor = client.isMobileMajor(); // Check For Mobile Major
console.log( isMobileMajor );
</script>
Your Result:
isMobileAndroid()
Is Mobile Android. Check if the browser is on an android mobile device.
<script>
var client = new ClientJS(); // Create A New Client Object
var isMobileAndroid = client.isMobileAndroid(); // Check For Mobile Android
console.log( isMobileAndroid );
</script>
Your Result:
isMobileOpera()
Is Mobile Opera. Check if the browser is on an opera mobile device.
<script>
var client = new ClientJS(); // Create A New Client Object
var isMobileOpera = client.isMobileOpera(); // Check For Mobile Opera
console.log( isMobileOpera );
</script>
Your Result:
isMobileWindows()
Is Mobile Windows. Check if the browser is on a windows mobile device.
<script>
var client = new ClientJS(); // Create A New Client Object
var isMobileWindows = client.isMobileWindows(); // Check For Mobile Windows
console.log( isMobileWindows );
</script>
Your Result:
isMobileBlackBerry()
Is Mobile BlackBerry. Check if the browser is on a blackberry mobile device.
<script>
var client = new ClientJS(); // Create A New Client Object
var isMobileBlackBerry = client.isMobileBlackBerry(); // Check For Mobile Blackberry
console.log( isMobileBlackBerry );
</script>
Your Result:
iOS Methods
iOS (previously iPhone OS) is a mobile operating system developed and distributed by Apple Inc.
isMobileIOS()
Is Mobile iOS. Check if the browser is on an Apple iOS device.
<script>
var client = new ClientJS(); // Create A New Client Object
var isMobileIOS = client.isMobileIOS(); // Check For Mobile iOS
console.log( isMobileIOS );
</script>
Your Result:
isIphone()
Is Iphone. Check if the browser is on an Apple iPhone.
<script>
var client = new ClientJS(); // Create A New Client Object
var isIphone = client.isIphone(); // Check For iPhone
console.log( isIphone );
</script>
Your Result:
isIpad()
Is Ipad. Check if the browser is on an Apple iPad.
<script>
var client = new ClientJS(); // Create A New Client Object
var isIpad = client.isIpad(); // Check For iPad
console.log( isIpad );
</script>
Your Result:
isIpod()
Is Ipod. Check if the browser is on an Apple iPod.
<script>
var client = new ClientJS(); // Create A New Client Object
var isIpod = client.isIpod(); // Check For iPod
console.log( isIpod );
</script>
Your Result:
Screen Methods
An electronic visual display for computers. The screen monitor comprises the display device, circuitry and an enclosure.
getScreenPrint()
Get Screen Print. Return a string containing screen information.
<script>
var client = new ClientJS(); // Create A New Client Object
var screenPrint = client.getScreenPrint(); // Get Screen Print
console.log( screenPrint );
</script>
Your Result:
getColorDepth()
Get Color Depth. Return a string containing the color depth.
<script>
var client = new ClientJS(); // Create A New Client Object
var colorDepth = client.getColorDepth(); // Get Color Depth
console.log( colorDepth );
</script>
Your Result:
getCurrentResolution()
Get Current Resolution. Return a string containing the current resolution.
<script>
var client = new ClientJS(); // Create A New Client Object
var currentResolution = client.getCurrentResolution(); // Get Current Resolution
console.log( currentResolution );
</script>
Your Result:
getAvailableResolution()
Get Available Resolution. Return a string containing the available resolution.
<script>
var client = new ClientJS(); // Create A New Client Object
var availableResolution = client.getAvailableResolution(); // Get Available Resolution
console.log( availableResolution );
</script>
Your Result:
getDeviceXDPI()
Get Device XPDI. Return a string containing the device XPDI.
<script>
var client = new ClientJS(); // Create A New Client Object
var deviceXDPI = client.getDeviceXDPI(); // Get Device XDPI
console.log( deviceXDPI );
</script>
Your Result:
getDeviceYDPI()
Get Device YDPI. Return a string containing the device YDPI.
<script>
var client = new ClientJS(); // Create A New Client Object
var deviceYDPI = client.getDeviceYDPI(); // Get Device YDPI
console.log( deviceYDPI );
</script>
Your Result:
Plugin Methods
In computing, a plug-in (or plugin, extension) is a software component that adds a specific feature to an existing software application. When an application supports plug-ins, it enables customization.
getPlugins()
Get Plugins. Return a string containing a list of installed plugins.
<script>
var client = new ClientJS(); // Create A New Client Object
var plugins = client.getPlugins(); // Get Plugins
console.log( plugins );
</script>
Your Result:
isJava()
Is Java. Check if Java is installed.
<script>
var client = new ClientJS(); // Create A New Client Object
var isJava = client.isJava(); // Check For Java
console.log( isJava );
</script>
Your Result:
getJavaVersion()
Get Java Version. Return a string containing the Java Version.
<script>
var client = new ClientJS(); // Create A New Client Object
var javaVersion = client.getJavaVersion(); // Get Java Version
console.log( javaVersion );
</script>
Your Result:
isFlash()
Is Flash. Check if Flash is installed.
<script>
var client = new ClientJS(); // Create A New Client Object
var isFlash = client.isFlash(); // Check For Flash
console.log( isFlash );
</script>
Your Result:
getFlashVersion()
Get Flash Version. Return a string containing the Flash Version.
<script>
var client = new ClientJS(); // Create A New Client Object
var flashVersion = client.getFlashVersion(); // GET Flash Version
console.log( flashVersion );
</script>
Your Result:
isSilverlight()
Is Silverlight. Check if Silverlight is installed.
<script>
var client = new ClientJS(); // Create A New Client Object
var isSilverlight = client.isSilverlight(); // Check For Silverlight
console.log( isSilverlight );
</script>
Your Result:
getSilverlightVersion()
Get Silverlight Version. Return a string containing the Silverlight Version.
<script>
var client = new ClientJS(); // Create A New Client Object
var silverlightVersion = client.getSilverlightVersion(); // GET Silverlight Version
console.log( silverlightVersion );
</script>
Your Result:
Mime Type Methods
An Internet media type is a standard identifier used on the Internet to indicate the type of data that a file contains. The identifiers were originally defined in RFC 2046, and were called MIME types because they referred to the non-ASCII parts of email messages that were composed using the MIME (Multipurpose Internet Mail Extensions) specification. They are also sometimes referred to as Content-types.
isMimeTypes()
Is Mime Types. Check if mime types are installed.
<script>
var client = new ClientJS(); // Create A New Client Object
var isMimeTypes = client.isMimeTypes(); // Check For Mime Types
console.log( isMimeTypes );
</script>
Your Result:
getMimeTypes()
Get Mime Types. Return a string containing a list of installed mime types.
<script>
var client = new ClientJS(); // Create A New Client Object
var mimeTypes = client.getMimeTypes(); // Get Mime Types
console.log( mimeTypes );
</script>
Your Result:
Font Methods
A computer font (or font) is an electronic data file containing a set of glyphs, characters, or symbols such as dingbats. Although the term font first referred to a set of metal type sorts in one style and size, since the 1990s it is generally used to refer to a scalable set of digital shapes that may be printed at many different sizes.
isFont(font)
Is Font. Check if a font is installed.
<script>
var client = new ClientJS(); // Create A New Client Object
var font = "Times New Roman"; // Set Font String
var isFont = client.isFont(font); // Check For A Font
console.log( isFont );
</script>
Your Result:
getFonts()
Get Fonts. Return a string containing a list of installed fonts.
<script>
var client = new ClientJS(); // Create A New Client Object
var fonts = client.getFonts(); // Get Fonts
console.log( fonts );
</script>
Your Result:
Storage Methods
Web storage supports persistent data storage, similar to cookies but with a greatly enhanced capacity and no information stored in the HTTP request header. There are two main web storage types: local storage and session storage, behaving similarly to persistent cookies and session cookies respectively.
isLocalStorage()
Is Local Storage. Check if local storage is avaliable.
<script>
var client = new ClientJS(); // Create A New Client Object
var isLocalStorage = client.isLocalStorage(); // Check For Local Storage
console.log( isLocalStorage );
</script>
Your Result:
isSessionStorage()
Is Session Storage. Check if session storage is avaliable.
<script>
var client = new ClientJS(); // Create A New Client Object
var isSessionStorage = client.isSessionStorage(); // Check For Session Storage
console.log( isSessionStorage );
</script>
Your Result:
isCookie()
Is Cookie. Check if cookies are avaliable.
<script>
var client = new ClientJS(); // Create A New Client Object
var isCookie = client.isCookie(); // Check For Cookies
console.log( isCookie );
</script>
Your Result:
Time Methods
Time is a dimension in which events can be ordered from the past through the present into the future, and also the measure of durations of events and the intervals between them. A time zone is a region on Earth that has a uniform standard time for legal, commercial, and social purposes.
getTimeZone()
Get Time Zone. Return a lowercase string containing the time zone.
<script>
var client = new ClientJS(); // Create A New Client Object
var timeZone = client.getTimeZone(); // Get Time Zone
console.log( timeZone );
</script>
Your Result:
Language Methods
Language preferences of client browsers.
getLanguage()
Get Language. Return a lowercase string containing the user language.
<script>
var client = new ClientJS(); // Create A New Client Object
var language = client.getLanguage(); // Get User Language
console.log( language );
</script>
Your Result:
getSystemLanguage()
Get SystemLanguage. Return a lowercase string containing the system language.
<script>
var client = new ClientJS(); // Create A New Client Object
var systemLanguage = client.SystemLanguage(); // Get System Language
console.log( systemLanguage );
</script>
Your Result:
Canvas Methods
The HTML5 <canvas> element is used to draw graphics, on the fly, via scripting (usually JavaScript).
isCanvas()
Is Canvas. Check if the canvas element is available.
<script>
var client = new ClientJS(); // Create A New Client Object
var isCanvas = client.isCanvas(); // Check For The Canvas Element
console.log( isCanvas );
</script>
Your Result:
getCanvasPrint()
Get Canvas Print. Return a string containing canvas image information.
<script>
var client = new ClientJS(); // Create A New Client Object
var canvasPrint = client.getCanvasPrint(); // Get Canvas Print
console.log( canvasPrint );
</script>
Your Result:
Additional Info
Additional details about the compiler we use, ClientJS dependencies, known issues, and our software licence.
Closure Compiled
The 'client.min.js' file is created by running the source code through the Google Closure Compiler.
Instead of compiling from a source language to machine code, the Google Closure Compiler compiles from JavaScript to better JavaScript. It parses your JavaScript, analyzes it, removes dead code and rewrites and minimizes what's left. It also checks syntax, variable references, and types, and warns about common JavaScript pitfalls.
Dependencies
ClientJS is completely written in JavaScript. It has no Adobe Flash, Java App, or Silverlight dependencies, but it can tell you if those browser plugins are installed and their version numbers!
ClientJS is also written in pure or native JavaScript, so that it does not rely on jQuery, MooTools, underscorejs or any other JavaScript library. This does not mean ClientJS has no dependencies at all. ClientJS does rely on multiple other open source pure JavaScript libraries, projects, and snippets. Don't worry though! All of that dependent code is hidden inside the ClientJS minified code, ‘client.min.js’ so you don’t have to include more silly stuff. The file ‘client.min.js’ has everything you need to execute any ClientJS method or calculation! :-)
Dependencies are listed below:
- ua-parser.js
- fontdetect.js
- swfobject.js
- murmurhash3.js
ClientJS is built upon and owes credit to the great work below:
Known Issues
There are quite a few known issues at the moment. We are working on trying to solve them instead of listing them as this project is so young. Please help us out by checking us out at github!
Contribute To The Code On Github
Just visit our github page at https://github.com/jackspirou/clientjs!