如何检测Safari浏览器使用JavaScript?我尝试了下面的代码,它不仅检测Safari浏览器,而且还检测Chrome浏览器。
function IsSafari() {
var is_safari = navigator.userAgent.toLowerCase().indexOf('safari/') > -1;
return is_safari;
}
如何检测Safari浏览器使用JavaScript?我尝试了下面的代码,它不仅检测Safari浏览器,而且还检测Chrome浏览器。
function IsSafari() {
var is_safari = navigator.userAgent.toLowerCase().indexOf('safari/') > -1;
return is_safari;
}
当前回答
我知道这个问题很老了,但我还是想把答案贴出来,因为它可能会帮助到别人。上述解决方案在某些极端情况下是失败的,所以我们必须以一种分别处理iOS、Desktop和其他平台的方式来实现它。
function isSafari() {
var ua = window.navigator.userAgent;
var iOS = !!ua.match(/iP(ad|od|hone)/i);
var hasSafariInUa = !!ua.match(/Safari/i);
var noOtherBrowsersInUa = !ua.match(/Chrome|CriOS|OPiOS|mercury|FxiOS|Firefox/i)
var result = false;
if(iOS) { //detecting Safari in IOS mobile browsers
var webkit = !!ua.match(/WebKit/i);
result = webkit && hasSafariInUa && noOtherBrowsersInUa
} else if(window.safari !== undefined){ //detecting Safari in Desktop Browsers
result = true;
} else { // detecting Safari in other platforms
result = hasSafariInUa && noOtherBrowsersInUa
}
return result;
}
其他回答
正如其他人已经注意到的,特性检测比检查特定浏览器更受欢迎。一个原因是用户代理字符串可以更改。另一个原因是字符串可能会在新版本中更改并破坏代码。
如果您仍然想要测试任何Safari版本,我建议使用这个
var isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1 &&
navigator.userAgent &&
navigator.userAgent.indexOf('CriOS') == -1 &&
navigator.userAgent.indexOf('FxiOS') == -1;
这将适用于所有设备上的任何版本的Safari: Mac, iPhone, iPod, iPad。
Edit
要在当前浏览器中测试:https://jsfiddle.net/j5hgcbm2/
编辑2
根据Chrome文档更新,以正确检测iOS上的Chrome
值得注意的是,iOS上的所有浏览器都只是Safari的包装,使用相同的引擎。看到bfred。这是他在这个帖子里对自己的回答的评论。
编辑3
根据Firefox文档更新,以正确检测iOS上的Firefox
为了记录,我发现最安全的方法是实现下面答案中的浏览器检测代码的Safari部分:
const isSafari = window['safari'] && safari.pushNotification &&
safari.pushNotification.toString() === '[object SafariRemoteNotification]';
当然,如果可能的话,处理特定于浏览器的问题的最佳方法总是进行特性检测。不过,使用上面这样的一段代码仍然比代理字符串检测要好。
我用这个
function getBrowserName() {
var name = "Unknown";
if(navigator.userAgent.indexOf("MSIE")!=-1){
name = "MSIE";
}
else if(navigator.userAgent.indexOf("Firefox")!=-1){
name = "Firefox";
}
else if(navigator.userAgent.indexOf("Opera")!=-1){
name = "Opera";
}
else if(navigator.userAgent.indexOf("Chrome") != -1){
name = "Chrome";
}
else if(navigator.userAgent.indexOf("Safari")!=-1){
name = "Safari";
}
return name;
}
if( getBrowserName() == "Safari" ){
alert("You are using Safari");
}else{
alert("You are surfing on " + getBrowserName(name));
}
这个独特的“问题”是100%的标志,浏览器是Safari(信不信由你)。
if (Object.getOwnPropertyDescriptor(Document.prototype, 'cookie').descriptor === false) {
console.log('Hello Safari!');
}
这意味着cookie对象描述符在Safari上设置为假,而在其他所有项目上设置为真,这实际上让我在其他项目上头疼。编码快乐!
只有Safari浏览器没有Chrome浏览器:
在尝试了其他代码之后,我没有发现任何适用于新版本和旧版本Safari的代码。
最后,我做了这段代码,对我来说工作得很好:
var ua = navigator.userAgent.toLowerCase(); var isSafari = false; try { isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification); } catch(err) {} isSafari = (isSafari || ((ua.indexOf('safari') != -1)&& (!(ua.indexOf('chrome')!= -1) && (ua.indexOf('version/')!= -1)))); //test if (isSafari) { //Code for Safari Browser (Desktop and Mobile) document.getElementById('idbody').innerHTML = "This is Safari!"; } else { document.getElementById('idbody').innerHTML = "Not is Safari!"; } <body id="idbody"> </body>