zoukankan      html  css  js  c++  java
  • 手写区分PC还是手机移动端

    区分首先要了解window.navigator

    输出navigator

    appCodeName: "Mozilla"
    appName: "Netscape"
    appVersion: "5.0 (iPhone; CPU iPhone OS 13_2_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Mobile/15E148 Safari/604.1"
    clipboard: Clipboard {}
    connection: NetworkInformation {onchange: null, effectiveType: "4g", rtt: 100, downlink: 10, saveData: false}
    cookieEnabled: true
    credentials: CredentialsContainer {}
    deviceMemory: 8
    doNotTrack: null
    geolocation: Geolocation {}
    hardwareConcurrency: 4
    keyboard: Keyboard {}
    language: "zh-CN"
    languages: (3) ["zh-CN", "zh", "en"]
    locks: LockManager {}
    maxTouchPoints: 1
    mediaCapabilities: MediaCapabilities {}
    mediaDevices: MediaDevices {ondevicechange: null}
    mediaSession: MediaSession {metadata: null, playbackState: "none"}
    mimeTypes: MimeTypeArray {length: 0}
    onLine: true
    permissions: Permissions {}
    platform: "Win32"
    plugins: PluginArray {length: 0}
    presentation: Presentation {receiver: null, defaultRequest: null}
    product: "Gecko"
    productSub: "20030107"
    serviceWorker: ServiceWorkerContainer {controller: null, ready: Promise, oncontrollerchange: null, onmessage: null, onmessageerror: null}
    storage: StorageManager {}
    usb: USB {onconnect: null, ondisconnect: null}
    userActivation: UserActivation {hasBeenActive: true, isActive: true}
    userAgent: "Mozilla/5.0 (iPhone; CPU iPhone OS 13_2_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Mobile/15E148 Safari/604.1"
    vendor: "Google Inc."
    vendorSub: ""
    webkitPersistentStorage: DeprecatedStorageQuota {}
    webkitTemporaryStorage: DeprecatedStorageQuota {}
    xr: XR {ondevicechange: null}
    __proto__: Navigator
    

    cookieEnabled:cookie是否启用;如果 cookie 已启用true,否则返回 false。

    appName:浏览器名称;

    通常返回"Netscape" 是 IE11、Chrome、Firefox 以及 Safari 的应用程序名称的统称。

    appCodeName:浏览器的应用程序代码名称;

    通常返回"Mozilla" 是 Chrome、Firefox、IE、Safari 以及 Opera 的应用程序代码名称。

    product:属性返回浏览器引擎的产品名称

    appVersion:属性返回有关浏览器的版本信息

    platform:属性返回浏览器平台(操作系统)

    language:属性返回浏览器语言

    onLine:属性返回 true,假如浏览器在线

    userAgent:属性返回由浏览器发送到服务器的用户代理报头(user-agent header)

    先看看chrome、safari、ios、android的返回值

    chrome:
        Mozilla/5.0 
        (Macintosh; Intel Mac OS X 10_12_6) 
        AppleWebKit/537.36 (KHTML, like Gecko) 
        Chrome/61.0.3163.91 Safari/537.36
    safari:
        Mozilla/5.0 
        (Macintosh; Intel Mac OS X 10_12_6) 
        AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 
        Safari/604.1.38
    ios11刘海X:
        Mozilla/5.0 
        (iPhone; CPU iPhone OS 11_0 like Mac OS X) 
        AppleWebKit/604.1.38 (KHTML, like Gecko) 
        Version/11.0 Mobile/15A372 Safari/604.1
    ipad:
        Mozilla/5.0 
        (iPad; CPU OS 9_1 like Mac OS X) 
        AppleWebKit/601.1.46 (KHTML, like Gecko)
        Version/9.0 Mobile/13B143 Safari/601.1
    galxy sansum:
        Mozilla/5.0 
        (Linux; Android 5.0; SM-G900P Build/LRX21T) 
        AppleWebKit/537.36 (KHTML, like Gecko) 
        Chrome/61.0.3163.91 Mobile Safari/537.36
    安装uc浏览器:
        Mozilla/5.0 
        (Linux; U; Android 6.0.1; zh-CN; Mi Note 2 Build/MXB48T)
        AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 
        Chrome/40.0.2214.89 UCBrowser/11.4.9.941 Mobile Safari/537.36
    winphone:
        Mozilla/5.0 
        (Linux; Android 5.1.1; Nexus 6 Build/LYZ28E) 
        AppleWebKit/537.36 (KHTML, like Gecko) 
        Chrome/61.0.3163.91 Mobile Safari/537.36
    hybrid方法的可能:
        Mozilla/5.0 
        (iPhone; CPU iPhone OS 11_0 like Mac OS X) 
        AppleWebKit/604.1.38 (KHTML, like Gecko) 
        Mobile/15A372 weibo/80011134
    
        var os = function() {
            var ua = navigator.userAgent,
            isWindowsPhone = /(?:Windows Phone)/.test(ua),
            isSymbian = /(?:SymbianOS)/.test(ua) || isWindowsPhone, 
            isAndroid = /(?:Android)/.test(ua), 
             isFireFox = /(?:Firefox)/.test(ua), 
             isChrome = /(?:Chrome|CriOS)/.test(ua),
             isTablet = /(?:iPad|PlayBook)/.test(ua) || (isAndroid && !/(?:Mobile)/.test(ua)) || (isFireFox && /(?:Tablet)/.test(ua)),
             isPhone = /(?:iPhone)/.test(ua) && !isTablet,
             isPc = !isPhone && !isAndroid && !isSymbian;
             return {
                isTablet: isTablet,
                isPhone: isPhone,
                isAndroid : isAndroid,
                isPc : isPc
            };
         }();
         if(os.isAndroid || os.isPhone || os.isTablet){
            document.write('mobile')
         }else{
            document.write('pc');
         }
    

    移动端返回的是:“Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Mobile Safari/537.36”

    移动端有“Mobile”这个值。。PC端没有;

    navigator详细说明

  • 相关阅读:
    lnmp分离及其迁移数之一---数据库迁移
    lnmp wordpress...
    LNMP安装
    rpm 强制卸载
    ss ifconfig工具
    nginx--日志
    nginx--模块2--基于用户
    python-网络编程
    基本数据之-字典
    Python【day 9】函数入门1
  • 原文地址:https://www.cnblogs.com/facy/p/13039485.html
Copyright © 2011-2022 走看看