判断浏览器是否支持WebP格式的图片

support-webp.ts

export default new Promise(resolve => {
	const image = new Image();
	image.onerror = () => resolve(false);
	image.onload = () => resolve(image.width === 1);
	image.src = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoBAAEAAwA0JaQAA3AA/vuUAAA=';
}).catch(() => false);

或者判断系统版本：安卓都支持，ios14以下不支持

export default class Platform {
    static isWeixin() {
        return /micromessenger/i.test(navigator.userAgent.toLowerCase())
    }

    static isIOS() {
        return /(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)
    }

    static androidVer() {
        return ua.match(/android (.*?);/)
    }

    static osVer () {
        const ua = navigator.userAgent.toLowerCase()
        const v = ua.match(/cpu iphone os (.*?) like mac os/)
        return v[1].replace(/[_]/g,'.')
    }

    static osVersion = (() => {
        const [, version = 0] = navigator.userAgent.match(/os\s+(\d+)/i) || []

        return Number(version)
    })()


    static isMiniApp() {
        return /miniProgram/i.test(navigator.userAgent) || (window.__wxjs_environment === 'miniprogram')
    }

    static isAlipayClientApp() {
        return /AlipayClient/i.test(navigator.userAgent)
    }

    static isWxClientApp() {
        return (/MicroMessenger/i.test(navigator.userAgent) && /miniProgram/i.test(navigator.userAgent))
    }

    static isAndroid() {
        return /(Android)/i.test(navigator.userAgent.toLowerCase())
    }

    static isIphoneX() {
        if (/iphone/gi.test(window.navigator.userAgent)) {
            /* iPhone X、iPhone XS */
            var x = window.screen.width === 375 && window.screen.height === 812
            /* iPhone XS Max */
            var xsMax = window.screen.width === 414 && window.screen.height === 896
            /* iPhone XR */
            var xR = window.screen.width === 414 && window.screen.height === 896
            /* iPhone 12 */
            var x12 = window.screen.width === 390 && window.screen.height === 844
            if (x || xsMax || xR ||x12) {
                return true
            } else {
                return false
            }
        } else {
            return false
        }
    }
}



// 判断是否可以使用webp
export function isWebpConfiger(){
    const webpSupport = Platform.isAndroid() || (Platform.isIOS() && Platform.osVersion >= 14); // 是否支持webp
    return webpSupport
}