Как определить браузер Safari с помощью JavaScript? Я попробовал код ниже, и он обнаруживает не только Safari, но и браузер Chrome.
function IsSafari() {
var is_safari = navigator.userAgent.toLowerCase().indexOf('safari/') > -1;
return is_safari;
}
Вы можете легко использовать индекс Chrome для фильтрации Chrome:
var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf('safari') != -1) {
if (ua.indexOf('chrome') > -1) {
alert("1") // Chrome
} else {
alert("2") // Safari
}
}
Примечание. всегда пытайтесь определить конкретное поведение, которое вы пытаетесь исправить, вместо того, чтобы таргетировать его с помощью isSafari?
В качестве последнего средства обнаруживает Safari с этим регулярным выражением:
var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
Он использует негативный внешний вид и исключает Chrome, Edge и все браузеры Android, которые включают имя Safari в своем пользовательском агенте.
Как уже отмечали другие люди, обнаружение функции предпочтительнее, чем проверка конкретного браузера. Одна из причин заключается в том, что строка пользовательского агента может быть изменена. Другая причина в том, что строка может измениться и сломать ваш код в более новых версиях.
Если вы все еще хотите сделать это и протестировать любую версию 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.
Чтобы проверить в своем текущем браузере: https://jsfiddle.net/j5hgcbm2/
Обновлен в соответствии с документами Chrome для правильного определения Chrome на iOS
Стоит отметить, что все браузеры на iOS являются просто обертками для Safari и используют один и тот же движок. См. Bfred.it комментируйте его собственный ответ в этой теме.
Обновлен в соответствии с документами Firefox для правильного определения Firefox на iOS
Просто используйте:
var isSafari = window.safari !== undefined;
if (isSafari) console.log("Safari, yeah!");
Этот код используется для обнаружения только браузера Safari
if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0)
{
alert("Browser is Safari");
}
Поскольку userAgent для хрома и сафари почти одинаковы, проще смотреть на поставщика браузера.
Safari
navigator.vendor == "Apple Computer, Inc."
Chrome
navigator.vendor == "Google Inc."
FireFox (почему он пуст?)
navigator.vendor == ""
IE (почему он undefined?)
navigator.vendor == undefined
Только 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>Я не знаю, почему OP захотел обнаружить Safari, но в редком случае вам нужно обнюхивать браузер в наше время, что, вероятно, более важно определить механизм рендеринга, чем имя браузера. Например, в iOS все браузеры используют движок Safari/Webkit, поэтому бессмысленно получать "chrome" или "firefox" в качестве имени браузера, если базовый рендеринг фактически является Safari/Webkit. Я не тестировал этот код со старыми браузерами, но он работает со всем, что было довольно недавно на Android, iOS, OS X, Windows и Linux.
<script>
let browserName = "";
if(navigator.vendor.match(/google/i)) {
browserName = 'chrome/blink';
}
else if(navigator.vendor.match(/apple/i)) {
browserName = 'safari/webkit';
}
else if(navigator.userAgent.match(/firefox\//i)) {
browserName = 'firefox/gecko';
}
else if(navigator.userAgent.match(/edge\//i)) {
browserName = 'edge/edgehtml';
}
else if(navigator.userAgent.match(/trident\//i)) {
browserName = 'ie/trident';
}
else
{
browserName = navigator.userAgent + "\n" + navigator.vendor;
}
alert(browserName);
</script>
Чтобы уточнить:
Я использую этот
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));
}
Я знаю, что этот вопрос устарел, но я все равно думал о публикации ответа, поскольку это может помочь кому-то. Вышеупомянутые решения терпели неудачу в некоторых случаях, поэтому нам пришлось реализовать его таким образом, чтобы обрабатывать 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 - "Версия". Таким образом, это регулярное выражение будет работать идеально:
/.*Version.*Safari.*/.test(navigator.userAgent)
Измененное регулярное выражение для ответа выше
var isSafari = /^((?!chrome|android|crios|fxios).)*safari/i.test(navigator.userAgent);
Эта уникальная "проблема" на 100% означает, что браузер - это Safari (верьте или нет).
if (Object.getOwnPropertyDescriptor(Document.prototype, 'cookie').descriptor === false) {
console.log('Hello Safari!');
}
Это означает, что дескриптор объекта cookie установлен на false в Safari, а на другом - true, что фактически дает мне головную боль в другом проекте. Счастливое кодирование!
Возможно, это работает:
Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor')
РЕДАКТИРОВАТЬ: БЕЗ ДОЛГОЙ РАБОТЫ
Для записей самый безопасный способ, который я нашел, это реализовать часть кода Safari для определения браузера из этого ответа:
const isSafari = window['safari'] && safari.pushNotification &&
safari.pushNotification.toString() === '[object SafariRemoteNotification]';
Конечно, лучшим способом решения проблем, связанных с браузером, всегда является обнаружение функций, если это вообще возможно. Однако использование кода, подобного приведенному выше, все же лучше, чем определение строки агента.
Самый простой ответ:
function isSafari() {
if (navigator.vendor.match(/[Aa]+pple/g).length > 0 )
return true;
return false;
}