web-dev-qa-db-ja.com

javascriptを使用してタブレット、モバイル、デスクトップ、テレビを検出する方法

Javascriptからデバイスを検出する必要があるWebアプリケーションを開発しています。誰がそれを行うための最善の方法を教えてもらえますか?グーグルでいくつかの解決策を見つけました。しかし、誰も完全な証拠ではありません。 WURFLのようなサーバー側検出を使用したくありません。

私の更新

JavaScriptを使用してCSSメディアクエリを照合することにより、デバイスを検出しています。 Paul Irishによるpolyfillを使用したメディアクエリマッチングの場合 https://github.com/paulirish/matchMedia.js/

24
MAK Ripon

チェックアウトすることをお勧めします http://wurfl.io/

簡単に言えば、小さなJSファイルをインポートする場合:

<script type='text/javascript' src="//wurfl.io/wurfl.js"></script>

次のようなJSONオブジェクトが残ります。

{
 "complete_device_name":"Google Nexus 7",
 "is_mobile":true,
 "form_factor":"Tablet"
}

(もちろん、Nexus 7を使用していることを前提としています)、次のようなことができます:

if(WURFL.form_factor == "Tablet"){
    //dostuff();
}

これはあなたが探しているものです。

免責事項:私はこの無料サービスを提供する会社で働いています。ありがとう。

30
Luca Passani

次を使用できます。

1)JS:ユーザーエージェントによる検出

if (navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i))

ここからユーザーエージェント文字列を取得します: http://www.useragentstring.com/pages/useragentstring.php

2)CSS:レスポンシブデザインを使用する

3)JS:screen.widthによって画面の幅を検出します

44
user2050393