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

JavaScript

伽罗

2020-03-10

我有5个FF,Chrome,IE,Opera和Safari插件/扩展程序。

如何识别用户浏览器并重定向(一旦单击安装按钮)下载相应的插件?

第511篇《如何检测Safari,Chrome,IE,Firefox和Opera浏览器?》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

8个回答
达蒙神奇 2020.03.10

Simple, single line of JavaScript code will give you the name of browser:

function GetBrowser()
{
    return  navigator ? navigator.userAgent.toLowerCase() : "other";
}
Tom十三 2020.03.10

UAParser是轻量级JavaScript库之一,可从userAgent字符串识别浏览器,引擎,操作系统,CPU和设备类型/模型。

有可用的CDN。在这里,我提供了一个示例代码来使用UAParser检测浏览器。

<!doctype html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/ua-parser-js@0/dist/ua-parser.min.js"></script>
<script type="text/javascript">
    var parser = new UAParser();
    var result = parser.getResult();
    console.log(result.browser);     // {name: "Chromium", version: "15.0.874.106"}
</script>
</head>
<body>
</body>
</html>

现在,您可以使用的值对result.browser页面进行有条件的编程。

源教程:如何使用JavaScript检测浏览器,引擎,操作系统,CPU和设备?

逆天A前端 2020.03.10

还有一种不太“ hacky”的方法适用于所有流行的浏览器。Google在其Closure Library中包含了一个浏览器检查特别要看一下goog.userAgentgoog.userAgent.product这样,如果浏览器显示的方式发生了某些变化,您也可以保持最新(假设您始终运行最新版本的闭包编译器。)

逆天西门 2020.03.10

如果您需要了解某些特定浏览器的数字版本,可以使用以下代码段。目前,它将告诉您Chrome / Chromium / Firefox的版本:

var match = $window.navigator.userAgent.match(/(?:Chrom(?:e|ium)|Firefox)\/([0-9]+)\./);
var ver = match ? parseInt(match[1], 10) : 0;
null 2020.03.10
const isChrome = /Chrome/.test(navigator.userAgent)
const isFirefox = /Firefox/.test(navigator.userAgent)
JinJin理查德 2020.03.10

简短的变体

var browser = (function() {
    var test = function(regexp) {
        return regexp.test(window.navigator.userAgent);
    }
    switch (true) {
        case test(/edg/i): return "edge";
        case test(/opr/i) && (!!window.opr || !!window.opera): return "opera";
        case test(/chrome/i) && !!window.chrome: return "chrome";
        case test(/trident/i): return "ie";
        case test(/firefox/i): return "firefox";
        case test(/safari/i): return "safari";
        default: return "other";
    }
})();
console.log(browser)

番长西里神无 2020.03.10

截至2019年12月,这是几个处理浏览器检测的著名库。

lancedikson开发的Bowser- 4,065★s-最近更新-2019年10月2日-4.8KB

var result = bowser.getParser(window.navigator.userAgent);
console.log(result);
document.write("You are using " + result.parsedResult.browser.name +
               " v" + result.parsedResult.browser.version + 
               " on " + result.parsedResult.os.name);
<script src="https://unpkg.com/bowser@2.7.0/es5.js"></script>

*支持基于Chromium的Edge


bestiejs编写的Platform.js -2,550★s-最近更新于2019年4月14日-5.9KB

console.log(platform);
document.write("You are using " + platform.name +
               " v" + platform.version + 
               " on " + platform.os);
<script src="https://cdnjs.cloudflare.com/ajax/libs/platform/1.3.5/platform.min.js"></script>

gabceb的jQuery浏览器 -504★s-最近更新,2015年11月23日-1.3KB

console.log($.browser)
document.write("You are using " + $.browser.name +
               " v" + $.browser.versionNumber + 
               " on " + $.browser.platform);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-browser/0.1.0/jquery.browser.min.js"></script>

darcyclarke编写的Detect.js(已存档) -522★s-最近更新,2015年10月26日-2.9KB

var result = detect.parse(navigator.userAgent);
console.log(result);
document.write("You are using " + result.browser.family +
               " v" + result.browser.version + 
               " on " + result.os.family);
<script src="https://cdnjs.cloudflare.com/ajax/libs/Detect.js/2.2.2/detect.min.js"></script>

由QuirksMode 浏览器检测(存档) -最近更新时间2013年11月14日-884B

console.log(BrowserDetect)
document.write("You are using " + BrowserDetect.browser +
               " v" + BrowserDetect.version + 
               " on " + BrowserDetect.OS);
<script src="https://kylemit.github.io/libraries/libraries/BrowserDetect.js"></script>


重要说明:

  • whichBrowser -1,355★s-最后更新于2018年10月2日
  • Modernizr -23,397★s-最后更新于2019年1月12日-要喂饱一匹马,特征检测应该会引发任何canIuse风格的问题。浏览器检测实际上仅用于为各个浏览器提供自定义图像,下载文件或说明。

进一步阅读

飞云Jim梅 2020.03.10

我知道为此使用lib可能会矫kill过正,但是只是为了丰富线程,您可以检查is.js的执行方式:

is.firefox();
is.ie(6);
is.not.safari();

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android