web-dev-qa-db-ja.com

ブラウザがAndroidまたはiOSデバイスで実行されているかどうかを検出します

ユーザーがAndroidまたはiOSブラウザーで表示しているかどうかに応じて、モバイルWebサイトのボタンとテキストを変更する必要があります。チェックを実行する信頼できる方法はありますか?

66
soleil
var isMobile = {
    Windows: function() {
        return /IEMobile/i.test(navigator.userAgent);
    },
    Android: function() {
        return /Android/i.test(navigator.userAgent);
    },
    BlackBerry: function() {
        return /BlackBerry/i.test(navigator.userAgent);
    },
    iOS: function() {
        return /iPhone|iPad|iPod/i.test(navigator.userAgent);
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Windows());
    }
};
143
Anoop

navigator.useragentプロパティを使用して、useragent-stringを取得し、解析し、OSを検出します。

ここ は、その方法の一例です。

更新:

この質問の人気のため、回答に追加情報を追加すると思いました。

一般的に、ブラウザーのスニッフィングは、最善の方法ではありません。どうして?さて、多くの理由がありますが、ここに2つの良い理由があります:

  1. ほとんどすべての場合、人々がブラウザスニッフィングに目を向けるとき、機能検出の方が優れたオプションです。ユーザーが使用しているOS /ブラウザに応じて行動することが適切なまれなEdgeのケースがありますが、ほとんどの場合、 Modernizr のようなライブラリを使用して特定の機能のサポートを検出しますより良い方法です。サイト/アプリケーションをサポートする機能ではなく、特定のブラウザーに適応させようとするのは滑りやすい傾向があります。代わりに、ブラウザが必要な機能をサポートしているかどうかを確認し、サポートが不足している場合はポリフィルするか、ニースフォールバックを提供します。
  2. ブラウザのスニッフィングは非常に複雑です。どうして?ほとんどすべてのブラウザはユーザーエージェント文字列にあるか、特定の識別を可能にするのに十分な情報がないためです。

そうは言っても、本当にブラウザ/ OS検出を使用する必要がある場合は、車輪を再発明せず、自分でそれをしようとしないでください-あなたは痛みとあいまいな警告の世界にいるでしょう! WhichBrowser のようなライブラリを使用することをお勧めします。これは、OS、ブラウザ、レンダリングエンジン、およびデバイスに関する情報を含む便利なJavaScriptオブジェクトを提供します。

13

ナビゲーターオブジェクトを使用できます: http://www.w3schools.com/js/js_browser.asp そして、ナビゲーターのプロパティに基づいてifステートメントを使用します。

1
norway28

私はこれをしばらく使用しました。に基づいてtrueまたはfalseを返すかどうかを確認する簡単なチェックは、モバイルデバイスです。

var isMobile = (/Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Windows Phone/i.test(navigator.userAgent)) ? true : false;
0
meme