UNPKG

vue-device-detect

Version:

检测设备类型,根据设备类型渲染内容

290 lines (276 loc) 9.94 kB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var vue = require('vue'); var UAParser = require('ua-parser-js'); function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } var UAParser__default = /*#__PURE__*/_interopDefaultLegacy(UAParser); const ClientUAInstance = new UAParser__default["default"](); const browser = ClientUAInstance.getBrowser(); ClientUAInstance.getCPU(); const device = ClientUAInstance.getDevice(); const engine = ClientUAInstance.getEngine(); const os = ClientUAInstance.getOS(); const ua = ClientUAInstance.getUA(); function parseUA(userAgent) { const ua2 = new UAParser__default["default"](userAgent); return { browser: ua2.getBrowser(), cpu: ua2.getCPU(), device: ua2.getDevice(), engine: ua2.getEngine(), os: ua2.getOS(), ua: ua2.getUA() }; } const DeviceTypes = { Mobile: "mobile", Tablet: "tablet", SmartTv: "smarttv", Console: "console", Wearable: "wearable", Embedded: "embedded", Browser: void 0 }; const BrowserTypes = { Chrome: "Chrome", Firefox: "Firefox", Opera: "Opera", Yandex: "Yandex", Safari: "Safari", InternetExplorer: "Internet Explorer", Edge: "Edge", Chromium: "Chromium", Ie: "IE", MobileSafari: "Mobile Safari", EdgeChromium: "Edge Chromium", MIUI: "MIUI Browser", SamsungBrowser: "Samsung Browser" }; const OsTypes = { IOS: "iOS", Android: "Android", WindowsPhone: "Windows Phone", Windows: "Windows", MAC_OS: "Mac OS" }; const setDefaults = (p, d = "none") => p || d; const getNavigatorInstance = () => { if (typeof window !== void 0) { if (window.navigator || navigator) return window.navigator || navigator; } return false; }; const isIOS13Check = (type) => { const nav = getNavigatorInstance(); return nav && nav.platform && (nav.platform.includes(type) || nav.platform === "MacIntel" && nav.maxTouchPoints > 1 && !window.MSStream); }; const isMobileType = ({ type }) => type === DeviceTypes.Mobile; const isTabletType = ({ type }) => type === DeviceTypes.Tablet; const isMobileAndTabletType = ({ type }) => type === DeviceTypes.Mobile || type === DeviceTypes.Tablet; const isSmartTVType = ({ type }) => type === DeviceTypes.SmartTv; const isBrowserType = ({ type }) => type === DeviceTypes.Browser; const isWearableType = ({ type }) => type === DeviceTypes.Wearable; const isConsoleType = ({ type }) => type === DeviceTypes.Console; const isEmbeddedType = ({ type }) => type === DeviceTypes.Embedded; const getMobileVendor = ({ vendor }) => setDefaults(vendor); const getMobileModel = ({ model }) => setDefaults(model); const getDeviceType = ({ type }) => setDefaults(type, "browser"); const isAndroidType = ({ name }) => name === OsTypes.Android; const isWindowsType = ({ name }) => name === OsTypes.Windows; const isMacOsType = ({ name }) => name === OsTypes.MAC_OS; const isWinPhoneType = ({ name }) => name === OsTypes.WindowsPhone; const isIOSType = ({ name }) => name === OsTypes.IOS; const getOsVersion = ({ version }) => setDefaults(version); const getOsName = ({ name }) => setDefaults(name); const isChromeType = ({ name }) => name === BrowserTypes.Chrome; const isFirefoxType = ({ name }) => name === BrowserTypes.Firefox; const isChromiumType = ({ name }) => name === BrowserTypes.Chromium; const isEdgeType = ({ name }) => name === BrowserTypes.Edge; const isYandexType = ({ name }) => name === BrowserTypes.Yandex; const isSafariType = ({ name }) => name === BrowserTypes.Safari || name === BrowserTypes.MobileSafari; const isMobileSafariType = ({ name }) => name === BrowserTypes.MobileSafari; const isOperaType = ({ name }) => name === BrowserTypes.Opera; const isIEType = ({ name }) => name === BrowserTypes.InternetExplorer || name === BrowserTypes.Ie; const isMIUIType = ({ name }) => name === BrowserTypes.MIUI; const isSamsungBrowserType = ({ name }) => name === BrowserTypes.SamsungBrowser; const getBrowserFullVersion = ({ version }) => setDefaults(version); const getBrowserVersion = ({ major }) => setDefaults(major); const getBrowserName = ({ name }) => setDefaults(name); const getEngineName = ({ name }) => setDefaults(name); const getEngineVersion = ({ version }) => setDefaults(version); const isElectronType = () => { const nav = getNavigatorInstance(); const ua = nav && nav.userAgent && nav.userAgent.toLowerCase(); return ua === "string" ? /electron/.test(ua) : false; }; const isEdgeChromiumType = (ua) => typeof ua === "string" && ua.includes("Edg/"); const getIPad13 = () => isIOS13Check("iPad"); const getIphone13 = () => isIOS13Check("iPhone"); const getIPod13 = () => isIOS13Check("iPod"); const getIOS13 = () => { const nav = getNavigatorInstance(); return nav && (/iPad|iPhone|iPod/.test(nav.platform) || nav.platform === "MacIntel" && nav.maxTouchPoints > 1) && !window.MSStream; }; const isSmartTV = isSmartTVType(device); const isConsole = isConsoleType(device); const isWearable = isWearableType(device); const isEmbedded = isEmbeddedType(device); const isMobileSafari = isMobileSafariType(browser) || getIPad13(); const isChromium = isChromiumType(browser); const isMobile = isMobileAndTabletType(device) || getIPad13(); const isMobileOnly = isMobileType(device); const isTablet = isTabletType(device) || getIPad13(); const isBrowser = isBrowserType(device); const isDesktop = isBrowserType(device); const isAndroid = isAndroidType(os); const isWinPhone = isWinPhoneType(os); const isIOS = isIOSType(os) || getIPad13(); const isChrome = isChromeType(browser); const isFirefox = isFirefoxType(browser); const isSafari = isSafariType(browser); const isOpera = isOperaType(browser); const isIE = isIEType(browser); const osVersion = getOsVersion(os); const osName = getOsName(os); const fullBrowserVersion = getBrowserFullVersion(browser); const browserVersion = getBrowserVersion(browser); const browserName = getBrowserName(browser); const mobileVendor = getMobileVendor(device); const mobileModel = getMobileModel(device); const engineName = getEngineName(engine); const engineVersion = getEngineVersion(engine); const isEdge = isEdgeType(browser) || isEdgeChromiumType(ua); const isYandex = isYandexType(browser); const deviceType = getDeviceType(device); const isIOS13 = getIOS13(); const isIPad13 = getIPad13(); const isIPhone13 = getIphone13(); const isIPod13 = getIPod13(); const isElectron = isElectronType(); const isEdgeChromium = isEdgeChromiumType(ua); const isLegacyEdge = isEdgeType(browser) && !isEdgeChromiumType(ua); const isWindows = isWindowsType(os); const isMacOs = isMacOsType(os); const isMIUI = isMIUIType(browser); const isSamsungBrowser = isSamsungBrowserType(browser); var checklist = /*#__PURE__*/Object.freeze({ __proto__: null, isSmartTV: isSmartTV, isConsole: isConsole, isWearable: isWearable, isEmbedded: isEmbedded, isMobileSafari: isMobileSafari, isChromium: isChromium, isMobile: isMobile, isMobileOnly: isMobileOnly, isTablet: isTablet, isBrowser: isBrowser, isDesktop: isDesktop, isAndroid: isAndroid, isWinPhone: isWinPhone, isIOS: isIOS, isChrome: isChrome, isFirefox: isFirefox, isSafari: isSafari, isOpera: isOpera, isIE: isIE, osVersion: osVersion, osName: osName, fullBrowserVersion: fullBrowserVersion, browserVersion: browserVersion, browserName: browserName, mobileVendor: mobileVendor, mobileModel: mobileModel, engineName: engineName, engineVersion: engineVersion, isEdge: isEdge, isYandex: isYandex, deviceType: deviceType, isIOS13: isIOS13, isIPad13: isIPad13, isIPhone13: isIPhone13, isIPod13: isIPod13, isElectron: isElectron, isEdgeChromium: isEdgeChromium, isLegacyEdge: isLegacyEdge, isWindows: isWindows, isMacOs: isMacOs, isMIUI: isMIUI, isSamsungBrowser: isSamsungBrowser }); function createComponent(key, value) { const name = key.substring(2); return vue.defineComponent({ name: `${name}View`, props: { tagName: { type: String, default: "div" } }, setup(props, ctx) { return () => { const slot = ctx.slots.default?.(); return value ? vue.h(props.tagName, null, { default: () => slot }) : null; }; } }); } const list = {}; for (const key in checklist) { if (key.startsWith("is")) list[key] = createComponent(key, checklist[key]); } const vueDeviceDetect = { install(app) { for (const key in list) app.component(list[key].name, list[key]); } }; exports.browserName = browserName; exports.browserVersion = browserVersion; exports.deviceType = deviceType; exports.engineName = engineName; exports.engineVersion = engineVersion; exports.fullBrowserVersion = fullBrowserVersion; exports.isAndroid = isAndroid; exports.isBrowser = isBrowser; exports.isChrome = isChrome; exports.isChromium = isChromium; exports.isConsole = isConsole; exports.isDesktop = isDesktop; exports.isEdge = isEdge; exports.isEdgeChromium = isEdgeChromium; exports.isElectron = isElectron; exports.isEmbedded = isEmbedded; exports.isFirefox = isFirefox; exports.isIE = isIE; exports.isIOS = isIOS; exports.isIOS13 = isIOS13; exports.isIPad13 = isIPad13; exports.isIPhone13 = isIPhone13; exports.isIPod13 = isIPod13; exports.isLegacyEdge = isLegacyEdge; exports.isMIUI = isMIUI; exports.isMacOs = isMacOs; exports.isMobile = isMobile; exports.isMobileOnly = isMobileOnly; exports.isMobileSafari = isMobileSafari; exports.isOpera = isOpera; exports.isSafari = isSafari; exports.isSamsungBrowser = isSamsungBrowser; exports.isSmartTV = isSmartTV; exports.isTablet = isTablet; exports.isWearable = isWearable; exports.isWinPhone = isWinPhone; exports.isWindows = isWindows; exports.isYandex = isYandex; exports.mobileModel = mobileModel; exports.mobileVendor = mobileVendor; exports.osName = osName; exports.osVersion = osVersion; exports.parseUA = parseUA; exports.vueDeviceDetect = vueDeviceDetect;