终端检测

2023年05月30日

柏拉文

越努力，越幸运

一、检测浏览器名称

---

function getBrowserName() {
    const ua = navigator.userAgent.toLowerCase();

    if (ua.indexOf('opera') > -1 || ua.indexOf('opr') > -1) {
        return 'Opera';
    } else if (ua.indexOf('compatible') > -1 && ua.indexOf('msie') > -1) {
        return 'IE';
    } else if (ua.indexOf('edge') > -1 || ua.indexOf('edg') > -1) {
        return 'Edge';
    } else if (ua.indexOf('firefox') > -1) {
        return 'Firefox';
    } else if (ua.indexOf('safari') > -1 && ua.indexOf('chrome') == -1) {
        return 'Safari';
    } else if (ua.indexOf('chrome') > -1 && ua.indexOf('safari') > -1) {
        return 'Chrome';
    } else if (ua.indexOf('qqbrowser') > -1) {
        return 'QQBrowser';
    } else if (ua.indexOf('metasr') > -1) {
        return 'SogouBrowser';
    } else if (ua.indexOf('samsungbrowser') > -1) {
        return 'SamsungBrowser';
    } else if (ua.indexOf('miuibrowser') > -1) {
        return 'MiuiBrowser';
    } else {
        return '';
    }
}

1.1 检测 IE

通过 document.all: document.all表示页面内所有元素的一个集合。该方法不支持IE11。

function isIE(){
    if (document.all) {
      return true;
    } 
    return false;
}

通过 window.ActiveXObject: 兼容性非常好，从11到7都可以判断

function isIE(){
    if (window.ActiveXObject || "ActiveXObject" in window) {
        return true;
    }
    return false;
}

通过 window.navigator.userAgent

// 是否为 IE 10 及其以下版本
function isIE10(){
    const ua = window.navigator.userAgent.toLowerCase();
    return /MSIE/i.test(ua);
}
// 是否为 IE 11 及其以下版本
function isIE11(){
    const ua = window.navigator.userAgent.toLowerCase();
    return isIE10() || /trident/i.test(ua);
}

二、检测浏览器版本

---

function normalizeVersion(version: number | string) {
    if (typeof version === 'number') {
        return `${version}.0.0`;
    }
    return version;
}

function getBrowserVersion(browser: string) {
    let match = null;
    const defaultVersion = '0.0.0';
    const ua = navigator.userAgent.toLowerCase();
    console.log('ua', ua);

    switch (browser) {
        case 'safari':
            match = ua.match(/version\/([\d\.]+).*safari/);
            console.log('match', match);
            return match ? match?.[1] : defaultVersion;
        case 'chrome':
            match = ua.match(/chrom(e|ium)\/(\d+)\./);
            const version = match ? parseInt(match?.[2], 10) : defaultVersion;
            return this.normalizeVersion(version);
        case 'firefox':
            match = ua.match(/firefox\/([\d\.]+)/);
            return match ? match?.[1] : defaultVersion;
        case 'edge':
            match = ua.match(/edge?\/([\d\.]+)/);
            return match ? match?.[1] : defaultVersion;
        case 'ie':
            if (ua.indexOf('trident') > -1 && ua.indexOf('rv:11.0') > -1) {
                return '11.0.0';
            } else if (ua.indexOf('msie')) {
                return '10.0.0';
            }
            return defaultVersion;
        case 'opera':
            match = ua.match(/(?:opera|opr).([\d\.]+)/);
            return match ? match?.[1] : defaultVersion;
        default:
            return defaultVersion;
    }
}