简体   繁体   中英

Getting (mobile) device name from javascript

Is there a way to get the name of a mobile device (eg "John's iPhone" ) using javascript?


Maybe I wasn't very clear... what I meant is not whether it's an iPhone, iPad etc. but the "device name" - for example it can be "John's iPhone".

You can't do this through javascript for a web app running in a native browser - javascript generally doesn't have access to this personal identifying data.

One possible way is to use a framework like PhoneGap which may have an API to access the device name. But then, you can only deploy your web site via an app store, so this could be very limiting based on your use case.

Your best bet is to use the user agent:

eg

const ua = navigator.userAgent
const device = {
  iPad: /iPad/.test(ua),
  iPhone: /iPhone/.test(ua),
  Android4: /Android 4/.test(ua)
}

The object will allow you to write nice conditional logic such as if(device.iPad) { /* do stuff */ }

I'm working with mobile device with embedded scanner. To be able to use some the JavaScript library of different devices and to avoid conflict with those libraries of different manufacturer (Zebra, Honeywell, Datalogic, iOs ect...) I need to come up with a way to identify each devices so I can load the proper library and this is what I came up with. Enjoy

getDeviceName: function () {
    var deviceName = '';

    var isMobile = {
        Android: function() {
            return navigator.userAgent.match(/Android/i);
        },
        Datalogic: function() {
            return navigator.userAgent.match(/DL-AXIS/i);
        },
        Bluebird: function() {
            return navigator.userAgent.match(/EF500/i);
        },
        Honeywell: function() {
            return navigator.userAgent.match(/CT50/i);
        },
        Zebra: function() {
            return navigator.userAgent.match(/TC70|TC55/i);
        },
        BlackBerry: function() {
            return navigator.userAgent.match(/BlackBerry/i);
        },
        iOS: function() {
            return navigator.userAgent.match(/iPhone|iPad|iPod/i);
        },
        Windows: function() {
            return navigator.userAgent.match(/IEMobile/i);
        },
        any: function() {
            return (isMobile.Datalogic() || isMobile.Bluebird() || isMobile.Honeywell() || isMobile.Zebra() || isMobile.BlackBerry() || isMobile.Android() || isMobile.iOS() || isMobile.Windows());
        }
    };

    if (isMobile.Datalogic())
        deviceName = 'Datalogic';
    else if (isMobile.Bluebird())
        deviceName = 'Bluebird';
    else if (isMobile.Honeywell())
        deviceName = 'Honeywell';
    else if (isMobile.Zebra())
        deviceName = 'Zebra';
    else if (isMobile.BlackBerry())
        deviceName = 'BlackBerry';
    else if (isMobile.iOS())
        deviceName = 'iOS';
    else if ((deviceName == '') && (isMobile.Android()))
        deviceName = 'Android';
    else if ((deviceName == '') && (isMobile.Windows()))
        deviceName = 'Windows';

    if (deviceName != '') {
        consoleLog('Devices information deviceName = ' + deviceName);
        consoleLog('Devices information any = ' + isMobile.any());
        consoleLog('navigator.userAgent = ' + navigator.userAgent);
    }

    return deviceName;
},

and this is an example of how it can be used:

initializeHandheldScanners: function () {
    if (DeviceCtrl.getDeviceName() == 'Zebra')
        DeviceCtrl.initializeSymbolScanner();

    if (DeviceCtrl.getDeviceName() == 'Honeywell')
        DeviceCtrl.initializeHoneywellScanner();

    if (DeviceCtrl.getDeviceName() == 'Datalogic')
        DeviceCtrl.initializeDatalogicScanner();
},

You can say thanks to Cory LaViska. I did this based on his work. Here is the link if you want to know more

https://www.abeautifulsite.net/detecting-mobile-devices-with-javascript

You can use this snippet:

const getUA = () => {
    let device = "Unknown";
    const ua = {
        "Generic Linux": /Linux/i,
        "Android": /Android/i,
        "BlackBerry": /BlackBerry/i,
        "Bluebird": /EF500/i,
        "Chrome OS": /CrOS/i,
        "Datalogic": /DL-AXIS/i,
        "Honeywell": /CT50/i,
        "iPad": /iPad/i,
        "iPhone": /iPhone/i,
        "iPod": /iPod/i,
        "macOS": /Macintosh/i,
        "Windows": /IEMobile|Windows/i,
        "Zebra": /TC70|TC55/i,
    }
    Object.keys(ua).map(v => navigator.userAgent.match(ua[v]) && (device = v));
    return device;
}

console.log(getUA());

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM