web-dev-qa-db-ja.com

javascriptから（モバイル）デバイス名を取得する

Javascriptを使用してモバイルデバイス（「John'siPhone」など）の名前を取得する方法はありますか？

たぶん私はあまり明確ではありませんでした...私が意味したのは、それがiPhone、iPadなどであるかどうかではなく、「デバイス名」です。たとえば、「ジョンのiPhone」などです。

javascriptmobile-website
12
julius_am

ネイティブブラウザで実行されているWebアプリのJavaScriptを使用してこれを行うことはできません。通常、JavaScriptはこの個人識別データにアクセスできません。

考えられる方法の1つは、デバイス名にアクセスするためのAPIを持つ可能性のある PhoneGap のようなフレームワークを使用することです。ただし、Webサイトはアプリストア経由でしかデプロイできないため、ユースケースによっては非常に制限される可能性があります。

11
Kevin

最善の策は、ユーザーエージェントを使用することです。

例えば.

_var ua = navigator.userAgent,
browser = {
    iPad: /iPad/.test(ua),
    iPhone: /iPhone/.test(ua),
    Android4: /Android 4/.test(ua)
};
_

これにより、if(browser.iPad) { /* do stuff */ }などにアクセスできるようになります

12
Adam Heath

このスニペットを使用できます：

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());
1
Josh Merlino

スキャナーが組み込まれたモバイルデバイスを使用しています。さまざまなデバイスのJavaScriptライブラリを使用できるようにし、さまざまなメーカー（Zebra、Honeywell、Datalogic、iOsなど）のライブラリとの競合を回避するには、各デバイスを識別する方法を考え出す必要があります。適切なライブラリをロードすると、これが私が思いついたものです。楽しい

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;
},

これは、その使用方法の例です。

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

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

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

CoryLaViskaに感謝します。私は彼の仕事に基づいてこれをしました。詳細を知りたい場合は、こちらのリンクをご覧ください

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

1
Damien1970