web-dev-qa-db-ja.com

JavaScriptを使用してWindows 10 Edgeブラウザーをターゲットにする方法

可能な場合は機能の検出を行う必要がありますが、ブラウザーがMicrosoft Edgeブラウザーである場合はJavaScriptで検出できますか?

古い製品を保守しており、古いコードの修正に多くの時間を費やすことなく、一部の機能が破損する可能性があるという警告を表示したいと思います。

33
Willem de Wit

特定のブラウザの代わりに機能を検出してみてください。より将来性があります。ブラウザ検出を使用することはめったにありません。

邪魔にならないようにする方法の1つは、ライブラリを使用すること(ユーザーエージェント文字列には多くの複雑さがあります)、またはwindow.navigator.userAgentを手動で解析することです。

パーサーライブラリを使用

# https://github.com/faisalman/ua-parser-js.

var parser = new UAParser();
var result = parser.getResult();

var name = result.browser.name;
var version = result.browser.version;

Javascriptを使用した生のアプローチ

# Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, like Gecko) \
# Chrome/42.0.2311.135 Safari/537.36 Edge/12.10136

window.navigator.userAgent.indexOf("Edge") > -1
40
sandstrom

Edgeブラウザを検出する簡単なスクリプトを次に示します

if (/Edge/.test(navigator.userAgent)) {
    alert('Hello Microsoft User!');
}

説明:

/Edge/

文字列「Edge」を検索するための正規表現-次に、「navigator.userAgent」プロパティに対してテストします

18
Manoj Kadolkar

Useragent文字列にはEdge/12.9600が含まれます。12.9600はテストしたバージョン番号です。これは、「エッジ」モードのInternet Explorerのユーザーエージェント文字列とはまったく異なります。

Edgeのユーザーエージェント文字列:

Mozilla/5.0(Windows NT 10.0; Win64; x64)AppleWebKit/537.36(KHTML、Geckoなど)Chrome/42.0.2311.135 Safari/537.36 Edge/12.96

EdgeモードのIE10のユーザーエージェント文字列:

Mozilla/5.0(Windows NT 6.3; WOW64; Trident/7.0; .NET4.0E; .NET4.0C; InfoPath.3; .NET CLR 3.5.30729; .NET CLR 2.0.50727;。 NET CLR 3.0.30729; Tablet PC 2.0; rv:11.)Geckoのように

そのため、javascriptを使用する場合は、ユーザーエージェント文字列で単語「Edge」を確認してください。他のブラウザーもテストする場合は、まずEdgeを確認してください。そうしないと、誤検知が発生します(たとえば、ChromeまたはSafari ...)

7
David Perfors

この問題はあなただけではありません。この投稿を書いている時点では、GoogleアナリティクスでさえEdgeブラウザーだけを特定しているわけではありません。

最善の策は、リクエストのユーザーエージェントを参照することです。これは次のようなものになります。

Mozilla/5.0(Windows NT 10.0; Win64; x64)AppleWebKit/537.36(KHTML、Geckoなど)Chrome/42.0.2311.135 Safari/537.36 Edge/12.9600

(JavaScriptのリクエストからユーザーエージェントを抽出するには、この投稿を参照してください: JavaScriptでユーザーエージェントを取得する

EdgeはWindows 10でのみ使用できるため、この知識を使用してロジックが安全であることを確認できます。 UAで次の値を探します。

  • Windows NT 10.0-ユーザーがWindows 10にいることを示します
  • Edge-ユーザーがEdgeにいることを示します

もちろん、Edgeも検索できます。

アップデート-05/08

Googleアナリティクスには、Windows 10とEdgeがファーストクラスのディメンションとして含まれるようになり、これらの両方を直接フィルタリングできるようになりました。

4
Mark Cooper
navigator.appVersion.indexOf('Edge') > -1
4
cesaraviles

ここにあるスニペットもSOからのコピーです。元のコードへの参照を提供できなかったのは残念ですが、ここではスニペットを探している人のために修正しました。 IE 11およびMS Edge Window 10を確認します。

var get_ie_version = function () {
    var sAgent = window.navigator.userAgent;
    var Idx = sAgent.indexOf("MSIE");

    // If IE, return version number.
    if (Idx > 0) {
        return parseInt(sAgent.substring(Idx+ 5, sAgent.indexOf(".", Idx)));
    }
    // Condition Check IF IE 11 and or MS Edge
    else if ( !!navigator.userAgent.match(/Trident\/7\./)
        || window.navigator.userAgent.indexOf("Edge") > -1 )
    {
        return 11;
    } else {
        return 0; //It is not IE
    }
};
2
Meily Chhon

https://msdn.Microsoft.com/en-us/library/ms537509%28v=vs.85%29.aspx

試してみてください:

function getInternetExplorerVersion()
// Returns the version of Internet Explorer or a -1
// (indicating the use of another browser).
{
  var rv = -1; // Return value assumes failure.
  if (navigator.appName == 'Microsoft Internet Explorer')
  {
    var ua = navigator.userAgent;
    var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
    if (re.exec(ua) != null)
      rv = parseFloat( RegExp.$1 );
  }
  return rv;
}
function checkVersion()
{
  var msg = "You're not using Internet Explorer.";
  var ver = getInternetExplorerVersion();

  if ( ver > -1 )
  {
    if ( ver >= 8.0 ) 
      msg = "You're using a recent copy of Internet Explorer."
    else
      msg = "You should upgrade your copy of Internet Explorer.";
  }
  alert( msg );
}

文字列Microsoft Internet ExplorerEdgeまたは類似のものに置き換えます。

EDIT:ユーザーエージェント文字列が何であるかを知ることができます:

alert(navigator.userAgent)
0
Martin Fischer