Device type detection for iPhone and iPad with JavaScript

Device type detection for iPhone and iPad with JavaScript

Detecting iPhone and iPad with javascript
Not possible to detect the type of iOS device with Javascript.

Currently it is not possible for web developers to detect the type of iOS device with Javascript. In contrast to Android devices, Apple does not let you see whether visitors use an old iPhone 3G or the newest iPhone XS. However, if you want to target your website specifically for one of these devices you need this information. The device detection API enables you to detect the device type, brand, name, and more!

UserAgent

In the case of Android devices the so cal UserAgent gives information about the type of device and the browser. The "navigator.userAgent" function in JavaScript return a string containing this information. An example return is:

Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:47.0) Gecko/20100101 Firefox/47.0

So, you see that it is very hard to see what type of device is related to output of the userAgent. There is not clear structure in the userAgent of different devices. Thus, it is a hard job to discover the right device from each individual string. In the case of iOS devices it is not even possible to detect the specific name of device.

Device detection with our API

Because it is not possible to detect the type of iOS device with simple JavaScript code we need a solution. Therefore, we created a simple JavaScript API for you. Instead of using just only the userAgent string different devices characteristics are identified. By combining the information we can identify the type of iOS device. We use the following characteristics of the device:

  • The userAgent
  • The screen height
  • The screen Width
  • The pixel density
  • The CPU performance of the device

Instead of just returning type: "iPhone" (other API's) it is possible to detect type: "iPhone XS MAX". However, this is just one functionality of the device detection API. In this blogpost I describe all the different functionalities of the API.

 

Leave a Reply

Your email address will not be published. Required fields are marked *