Как обнаружить непопулярные браузеры (baidu) с помощью JavaScript? - PullRequest
Новая
       61

Как обнаружить непопулярные браузеры (baidu) с помощью JavaScript?

0 голосов
/ 20 ноября 2018

Я пытаюсь сделать свое приложение кросс-браузерным, предоставляя два стиля, один для браузеров, поддерживающих 3D-анимацию CSS, и другой для браузеров, которые этого не делают, используя этот код для определения функций: 

// Function from: https://stackoverflow.com/a/36191841/7982963
const isValueSupported = (prop, value) => {
  const el = document.createElement('div');
  el.style[prop] = value;
  return el.style[prop] === value;
}
// [unction from: http://lea.verou.me/2009/02/check-if-a-css-property-is-supported/
const isPropertySupported = property =>  property in document.body.style;

// Detection style inspired by Modernizr library
if (isValueSupported('perspective', '400px') && isValueSupported('transform-style', 'preserve-3d') && isValueSupported('backface-visibility', 'hidden') && isValueSupported('transform', 'rotateY(-180deg)') && isPropertySupported('perspective') && isPropertySupported('transform-style') && isPropertySupported('backface-visibility') && isPropertySupported('transform') && (!navigator.userAgent.includes('Firefox'))) {
  document.documentElement.classList.add('csstransforms3d');
} else {
  document.documentElement.classList.add('no-csstransforms3d');
}

Проблема в том, что, хотя некоторые браузеры, такие как Firefox, проходят тестирование, у них есть некоторые известные ошибки, такие как Ошибка обратной связи Mozilla , поэтому мне пришлось browser-sniff :. (
Я быстро нашел полезные результаты для Firefox: if (navigator.userAgent.includes('Firefox')), но для другого браузера оказалось, что у меня на компьютере под названием «Baidu browser» я не смог найти никаких результатов.
Так как же обнаружить такие браузеры?

1 Ответ

0 голосов
/ 20 ноября 2018

Вы можете обнаружить популярные браузеры в JavaScript с помощью следующего кода. 

// Mobile Browsers
export const isMobile = () => {
  const ua = (navigator || {}).userAgent;
  if (ua) {
    return (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(ua))
  }
  return false;
}

// Opera 8.0+
export const isOpera = () => {
  let opr = window.opr || {};
  return (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
}

// Firefox 1.0+
export const isFirefox = () => typeof InstallTrigger !== 'undefined';

// Safari 3.0+ "[object HTMLElementConstructor]" 
export const isSafari = () => {
  let safari = window.safari || {};
  return /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof safari !== 'undefined' && safari.pushNotification));
}

// Internet Explorer 6-11
export const isIE = () => /*@cc_on!@*/false || !!document.documentMode;

// Edge 20+
export const isEdge = () => !isIE() && !!window.StyleMedia;

// Chrome 1+
export const isChrome = () => !!window.chrome && !!window.chrome.loadTimes;

Так что все, что не соответствует ни одному из этих популярных браузеров, будет непопулярным браузером.

...