Javascript 如何获取浏览器的名称客户端?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12489546/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 10:31:09  来源:igfitidea点击:

How to get browser's name client side?

javascriptbrowsercross-browser

提问by Viral Shah

Is there any object/method that will give me information on the browser, client side?

是否有任何对象/方法可以为我提供有关浏览器、客户端的信息?

For example, I need to detect IE browser. I am using:

例如,我需要检测 IE 浏览器。我在用:

function st_IsIE()
{
    if(navigator.appName.indexOf("Microsoft Internet Explorer") != -1)
    {
        return true;
    }
    return false;
}

Is there a better way?

有没有更好的办法?

采纳答案by Raab

EDIT:Since the answer is not valid with newer versions of jquery As jQuery.browser is deprecated in ver 1.9, So Use Jquery Migrate Pluginfor that matter.

编辑:由于答案对较新版本的 jquery 无效,因为 jQuery.browser 在 1.9 版中已弃用,因此请为此使用 Jquery Migrate 插件



Original Answer

原答案

jQuery.browser

jQuery 浏览器

jQuery.browserand jQuery.browser.version

jQuery.browserjQuery.browser.version

is your way to go...

是你要走的路吗...

回答by pedram

JavaScript side - you can get browser name like these ways...

JavaScript 方面 - 您可以通过这些方式获取浏览器名称...

if(window.navigator.appName == "") OR if(window.navigator.userAgent == "")

回答by Aniket Kulkarni

This is pure JavaScript solution. Which I was required.
I tried on different browsers. It is working fine. Hope it helps.

这是纯JavaScript 解决方案。我被要求。
我在不同的浏览器上尝试过。它工作正常。希望能帮助到你。

How do I detect the browser name ?

如何检测浏览器名称?

You can use the navigator.appNameand navigator.userAgentproperties. The userAgentproperty is more reliable than appNamebecause, for example, Firefox (and some other browsers) may return the string "Netscape" as the value of navigator.appNamefor compatibility with Netscape Navigator.

您可以使用navigator.appNamenavigator.userAgent属性。该userAgent属性比appName因为例如,Firefox(和一些其他浏览器)可能返回字符串“Netscape”作为navigator.appName与 Netscape Navigator 兼容的值更可靠。

Note, however, that navigator.userAgentmay be spoofed, too – that is, clients may substitute virtually any string for their userAgent. Therefore, whatever we deduce from either appNameor userAgentshould be taken with a grain of salt.

但是请注意,这navigator.userAgent也可能是欺骗性的——也就是说,客户实际上可以用任何字符串替换他们的userAgent. 因此,无论我们从任何推断appNameuserAgent应与一粒盐服用。

var nVer = navigator.appVersion;
var nAgt = navigator.userAgent;
var browserName  = navigator.appName;
var fullVersion  = ''+parseFloat(navigator.appVersion); 
var majorVersion = parseInt(navigator.appVersion,10);
var nameOffset,verOffset,ix;

// In Opera, the true version is after "Opera" or after "Version"
if ((verOffset=nAgt.indexOf("Opera"))!=-1) {
   browserName = "Opera";
   fullVersion = nAgt.substring(verOffset+6);
   if ((verOffset=nAgt.indexOf("Version"))!=-1) 
     fullVersion = nAgt.substring(verOffset+8);
}
// In MSIE, the true version is after "MSIE" in userAgent
else if ((verOffset=nAgt.indexOf("MSIE"))!=-1) {
   browserName = "Microsoft Internet Explorer";
   fullVersion = nAgt.substring(verOffset+5);
}
// In Chrome, the true version is after "Chrome" 
else if ((verOffset=nAgt.indexOf("Chrome"))!=-1) {
   browserName = "Chrome";
   fullVersion = nAgt.substring(verOffset+7);
}
// In Safari, the true version is after "Safari" or after "Version" 
else if ((verOffset=nAgt.indexOf("Safari"))!=-1) {
   browserName = "Safari";
   fullVersion = nAgt.substring(verOffset+7);
   if ((verOffset=nAgt.indexOf("Version"))!=-1) 
     fullVersion = nAgt.substring(verOffset+8);
}
// In Firefox, the true version is after "Firefox" 
else if ((verOffset=nAgt.indexOf("Firefox"))!=-1) {
    browserName = "Firefox";
    fullVersion = nAgt.substring(verOffset+8);
}
// In most other browsers, "name/version" is at the end of userAgent 
else if ( (nameOffset=nAgt.lastIndexOf(' ')+1) < (verOffset=nAgt.lastIndexOf('/')) ) {
    browserName = nAgt.substring(nameOffset,verOffset);
    fullVersion = nAgt.substring(verOffset+1);
    if (browserName.toLowerCase()==browserName.toUpperCase()) {
       browserName = navigator.appName;
    }
}
// trim the fullVersion string at semicolon/space if present
if ((ix=fullVersion.indexOf(";"))!=-1)
    fullVersion=fullVersion.substring(0,ix);
if ((ix=fullVersion.indexOf(" "))!=-1)
    fullVersion=fullVersion.substring(0,ix);

majorVersion = parseInt(''+fullVersion,10);
if (isNaN(majorVersion)) {
    fullVersion  = ''+parseFloat(navigator.appVersion); 
    majorVersion = parseInt(navigator.appVersion,10);
}

document.write(''
                +'Browser name  = '+browserName+'<br>'
                +'Full version  = '+fullVersion+'<br>'
                +'Major version = '+majorVersion+'<br>'
                +'navigator.appName = '+navigator.appName+'<br>'
                +'navigator.userAgent = '+navigator.userAgent+'<br>');

From the source javascripter.net

来自源 javascripter.net

回答by Shree

In c# you your browser name using:

在 c# 中,您的浏览器名称使用:

System.Web.HttpBrowserCapabilities browser = Request.Browser;

For details see a link.

有关详细信息,请参阅链接。

http://msdn.microsoft.com/en-us/library/3yekbd5b%28v=vs.100%29.aspx

http://msdn.microsoft.com/en-us/library/3yekbd5b%28v=vs.100%29.aspx

and in Client side:

并在客户端:

JQuery:

查询:

jQuery.browser

For details see a link:

详情见链接:

http://api.jquery.com/jQuery.browser/

http://api.jquery.com/jQuery.browser/

回答by Sintrias

I found a purely Javascript solution herethat seems to work for major browsers for both PC and Mac. I tested it in BrowserStack for both platforms and it works like a dream. The Javascript solution posted in this thread by Jason D'Souza is really nice because it gives you a lot of information about the browser, but it has an issue identifying Edge which seems to look like Chrome to it. His code could probably be modified a bit with this solution to make it work for Edge too. Here is the snippet of code I found:

我在这里找到了一个纯粹的 Javascript 解决方案它似乎适用于 PC 和 Mac 的主要浏览器。我在 BrowserStack 中针对这两个平台对其进行了测试,它的工作原理就像做梦一样。Jason D'Souza 在此线程中发布的 Javascript 解决方案非常好,因为它为您提供了许多有关浏览器的信息,但它在识别 Edge 时遇到了问题,而 Edge 对它来说似乎看起来像 Chrome。他的代码可能会使用此解决方案进行一些修改,以使其也适用于 Edge。这是我找到的代码片段:

    var browser = (function (agent) {
    switch (true) {
        case agent.indexOf("edge") > -1: return "edge";
        case agent.indexOf("edg") > -1: return "chromium based edge (dev or canary)";
        case agent.indexOf("opr") > -1 && !!window.opr: return "opera";
        case agent.indexOf("chrome") > -1 && !!window.chrome: return "chrome";
        case agent.indexOf("trident") > -1: return "ie";
        case agent.indexOf("firefox") > -1: return "firefox";
        case agent.indexOf("safari") > -1: return "safari";
        default: return "other";
    }
})(window.navigator.userAgent.toLowerCase());
console.log(window.navigator.userAgent.toLowerCase() + "\n" + browser);

回答by Hosam Aly

The browser discloses it in navigator.userAgent. If you're using jQuery, you're better off using jQuery.browseras @Rab Nawaz said. However, as the API documentation says, it's better to check for feature support if possible. Quoting the documentation:

浏览器在navigator.userAgent. 如果您使用的是 jQuery,那么最好使用jQuery.browser@Rab Nawaz 所说的那样。但是,正如 API 文档所说,如果可能,最好检查功能支持。引用文档:

We recommend against using this property; please try to use feature detection instead (see jQuery.support). jQuery.browser may be moved to a plugin in a future release of jQuery.

我们建议不要使用此属性;请尝试改用功能检测(请参阅jQuery.support)。jQuery.browser 可能会在 jQuery 的未来版本中移动到插件中。

Here is a code example:

这是一个代码示例:

function isIE() {
    if (window.jQuery) {
        return jQuery.browser.msie || false;
    } else {
        // adapted from jQuery's source:
        return navigator.userAgent.toLowerCase().indexOf('msie') >= 0;
    }
}

回答by Steven Dsouza

This is answered in

这是在回答

How to detect Safari, Chrome, IE, Firefox and Opera browser?

如何检测 Safari、Chrome、IE、Firefox 和 Opera 浏览器?

Check thisfiddle.

检查this小提琴。

Hope this helps.

希望这可以帮助。

回答by Jason D'Souza

This code will return "browser" and "browserVersion"
Works on 95% of 80+ browsers

此代码将返回 "browser" 和 "browserVersion"
适用于 80 多种浏览器中的 95%

var geckobrowsers;
var browser = "";
var browserVersion = 0;
var agent = navigator.userAgent + " ";
if(agent.substring(agent.indexOf("Mozilla/")+8, agent.indexOf(" ")) == "5.0" && agent.indexOf("like Gecko") != -1){
    geckobrowsers = agent.substring(agent.indexOf("like Gecko")+10).substring(agent.substring(agent.indexOf("like Gecko")+10).indexOf(") ")+2).replace("LG Browser", "LGBrowser").replace("360SE", "360SE/");
    for(i = 0; i < 1; i++){
        geckobrowsers = geckobrowsers.replace(geckobrowsers.substring(geckobrowsers.indexOf("("), geckobrowsers.indexOf(")")+1), "");
    }
    geckobrowsers = geckobrowsers.split(" ");
    for(i = 0; i < geckobrowsers.length; i++){
        if(geckobrowsers[i].indexOf("/") == -1)geckobrowsers[i] = "Chrome";
        if(geckobrowsers[i].indexOf("/") != -1)geckobrowsers[i] = geckobrowsers[i].substring(0, geckobrowsers[i].indexOf("/"));
    }
    if(geckobrowsers.length < 4){
        browser = geckobrowsers[0];
    } else {
        for(i = 0; i < geckobrowsers.length; i++){
            if(geckobrowsers[i].indexOf("Chrome") == -1 && geckobrowsers[i].indexOf("Safari") == -1 && geckobrowsers[i].indexOf("Mobile") == -1 && geckobrowsers[i].indexOf("Version") == -1)browser = geckobrowsers[i];
        }
    }
    browserVersion = agent.substring(agent.indexOf(browser)+browser.length+1, agent.indexOf(browser)+browser.length+1+agent.substring(agent.indexOf(browser)+browser.length+1).indexOf(" "));
} else if(agent.substring(agent.indexOf("Mozilla/")+8, agent.indexOf(" ")) == "5.0" && agent.indexOf("Gecko/") != -1){
    browser = agent.substring(agent.substring(agent.indexOf("Gecko/")+6).indexOf(" ") + agent.indexOf("Gecko/")+6).substring(0, agent.substring(agent.substring(agent.indexOf("Gecko/")+6).indexOf(" ") + agent.indexOf("Gecko/")+6).indexOf("/"));
    browserVersion = agent.substring(agent.indexOf(browser)+browser.length+1, agent.indexOf(browser)+browser.length+1+agent.substring(agent.indexOf(browser)+browser.length+1).indexOf(" "));
} else if(agent.substring(agent.indexOf("Mozilla/")+8, agent.indexOf(" ")) == "5.0" && agent.indexOf("Clecko/") != -1){
    browser = agent.substring(agent.substring(agent.indexOf("Clecko/")+7).indexOf(" ") + agent.indexOf("Clecko/")+7).substring(0, agent.substring(agent.substring(agent.indexOf("Clecko/")+7).indexOf(" ") + agent.indexOf("Clecko/")+7).indexOf("/"));
    browserVersion = agent.substring(agent.indexOf(browser)+browser.length+1, agent.indexOf(browser)+browser.length+1+agent.substring(agent.indexOf(browser)+browser.length+1).indexOf(" "));
} else if(agent.substring(agent.indexOf("Mozilla/")+8, agent.indexOf(" ")) == "5.0"){
    browser = agent.substring(agent.indexOf("(")+1, agent.indexOf(";"));
    browserVersion = agent.substring(agent.indexOf(browser)+browser.length+1, agent.indexOf(browser)+browser.length+1+agent.substring(agent.indexOf(browser)+browser.length+1).indexOf(" "));
} else if(agent.substring(agent.indexOf("Mozilla/")+8, agent.indexOf(" ")) == "4.0" && agent.indexOf(")")+1 == agent.length-1){
    browser = agent.substring(agent.indexOf("(")+1, agent.indexOf(")")).split("; ")[agent.substring(agent.indexOf("(")+1, agent.indexOf(")")).split("; ").length-1];
} else if(agent.substring(agent.indexOf("Mozilla/")+8, agent.indexOf(" ")) == "4.0" && agent.indexOf(")")+1 != agent.length-1){
    if(agent.substring(agent.indexOf(") ")+2).indexOf("/") != -1)browser = agent.substring(agent.indexOf(") ")+2, agent.indexOf(") ")+2+agent.substring(agent.indexOf(") ")+2).indexOf("/"));
    if(agent.substring(agent.indexOf(") ")+2).indexOf("/") == -1)browser = agent.substring(agent.indexOf(") ")+2, agent.indexOf(") ")+2+agent.substring(agent.indexOf(") ")+2).indexOf(" "));
    browserVersion = agent.substring(agent.indexOf(browser)+browser.length+1, agent.indexOf(browser)+browser.length+1+agent.substring(agent.indexOf(browser)+browser.length+1).indexOf(" "));
} else if(agent.substring(0, 6) == "Opera/"){
    browser = "Opera";
    browserVersion = agent.substring(agent.indexOf(browser)+browser.length+1, agent.indexOf(browser)+browser.length+1+agent.substring(agent.indexOf(browser)+browser.length+1).indexOf(" "));
    if(agent.substring(agent.indexOf("(")+1).indexOf(";") != -1)os = agent.substring(agent.indexOf("(")+1, agent.indexOf("(")+1+agent.substring(agent.indexOf("(")+1).indexOf(";"));
    if(agent.substring(agent.indexOf("(")+1).indexOf(";") == -1)os = agent.substring(agent.indexOf("(")+1, agent.indexOf("(")+1+agent.substring(agent.indexOf("(")+1).indexOf(")"));
} else if(agent.substring(0, agent.indexOf("/")) != "Mozilla" && agent.substring(0, agent.indexOf("/")) != "Opera"){
    browser = agent.substring(0, agent.indexOf("/"));
    browserVersion = agent.substring(agent.indexOf(browser)+browser.length+1, agent.indexOf(browser)+browser.length+1+agent.substring(agent.indexOf(browser)+browser.length+1).indexOf(" "));
} else {
    browser = agent;
}
alert(browser + " v" + browserVersion);

回答by balexandre

It's all about what you really want to do, but in times to come and right now, the best way is avoid browser detectionand check for features. like Canvas, Audio, WebSockets, etc through simple javascript calls or in your CSS, for me your best approach is use a tool like ModernizR:

这完全取决于您真正想做的事情,但在未来和现在,最好的方法是避免浏览器检测并检查功能。像CanvasAudioWebSockets等,通过简单的 javascript 调用或在你的 CSS 中,对我来说,你最好的方法是使用像ModernizR这样的工具:

Unlike with the traditional—but highly unreliable—method of doing “UA sniffing,” which is detecting a browser by its (user-configurable) navigator.userAgentproperty, Modernizr does actual feature detectionto reliably discern what the various browsers can and cannot do.

与传统但非常不可靠的“UA 嗅探”方法不同,该方法通过浏览器的(用户可配置的)navigator.userAgent属性检测浏览器,Modernizr 进行实际特征检测,以可靠地辨别各种浏览器可以做什么和不能做什么。

If using CSS, you can do this:

如果使用 CSS,您可以这样做:

.no-js .glossy,
.no-cssgradients .glossy {
    background: url("images/glossybutton.png");
}

.cssgradients .glossy {
    background-image: linear-gradient(top, #555, #333);
}

as it will load and append all features as a class name in the <html>element and you will be able to do as you wish in terms of CSS.

因为它将加载并附加所有功能作为<html>元素中的类名,您将能够在 CSS 方面随心所欲。

And you can even load files upon features, for example, load a polyfill js and css if the browser does not have native support

您甚至可以根据功能加载文件,例如,如果浏览器没有本机支持,则加载 polyfill js 和 css

Modernizr.load([
  // Presentational polyfills
  {
    // Logical list of things we would normally need
    test : Modernizr.fontface && Modernizr.canvas && Modernizr.cssgradients,
    // Modernizr.load loads css and javascript by default
    nope : ['presentational-polyfill.js', 'presentational.css']
  },
  // Functional polyfills
  {
    // This just has to be truthy
    test : Modernizr.websockets && window.JSON,
    // socket-io.js and json2.js
    nope : 'functional-polyfills.js',
    // You can also give arrays of resources to load.
    both : [ 'app.js', 'extra.js' ],
    complete : function () {
      // Run this after everything in this group has downloaded
      // and executed, as well everything in all previous groups
      myApp.init();
    }
  },
  // Run your analytics after you've already kicked off all the rest
  // of your app.
  'post-analytics.js'
]);

a simple example of requesting features from javascript:

从 javascript 请求功能的简单示例:

http://jsbin.com/udoyic/1

http://jsbin.com/udoyic/1

回答by Robin

Based on is.jsyou can write a helper file for getting browser name like this-

基于is.js,您可以编写一个帮助文件来获取这样的浏览器名称 -

const Browser = {};
const vendor = (navigator && navigator.vendor || '').toLowerCase();
const userAgent = (navigator && navigator.userAgent || '').toLowerCase();

Browser.getBrowserName = () => {
  if(isOpera()) return 'opera'; // Opera
  else if(isChrome()) return 'chrome'; // Chrome
  else if(isFirefox()) return 'firefox'; // Firefox
  else if(isSafari()) return 'safari'; // Safari
  else if(isInternetExplorer()) return 'ie'; // Internet Explorer
}


// Start Detecting browser helpers functions
function isOpera() {
  const isOpera = userAgent.match(/(?:^opera.+?version|opr)\/(\d+)/);
  return isOpera !== null;
}

function isChrome() {
  const isChrome = /google inc/.test(vendor) ? userAgent.match(/(?:chrome|crios)\/(\d+)/) : null;
  return isChrome !== null;
}

function isFirefox() {
  const isFirefox = userAgent.match(/(?:firefox|fxios)\/(\d+)/);
  return isFirefox !== null;
}

function isSafari() {
  const isSafari = userAgent.match(/version\/(\d+).+?safari/);
  return isSafari !== null;
}

function isInternetExplorer() {
  const isInternetExplorer = userAgent.match(/(?:msie |trident.+?; rv:)(\d+)/);
  return isInternetExplorer !== null;
}
// End Detecting browser helpers functions

export default Browser;

And just import this file where you need.

只需在需要的地方导入此文件。

import Browser from './Browser.js';

const userBrowserName = Browser.getBrowserName() // return your browser name
                                                 // opera | chrome | firefox | safari | ie