区分首先要了解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详细说明

手写区分PC还是手机移动端的更多相关文章

  1. 【转】Nginx区分PC或手机访问不同网站

    原文链接:http://www.nginx.cn/784.html 近几年来,随着手机和pad的普及,越来越多的用户选择使用移动客户端访问网站,而为了获取更好的用户体验,就需要针对不同的设备显示出最合 ...

  2. Nginx区分PC或手机访问不同网站

    近几年来,随着手机和pad的普及,越来越多的用户选择使用移动客户端访问网站,而为了获取更好的用户体验,就需要针对不同的设备显示出最合适的匹配,这样就是近年来流行的“响应式web设计”. 响应式web设 ...

  3. Nginx区分PC和手机

    目录 一.简介 二.配置 nginx识别手机端跳转到wap pc端跳转移动端 一.简介 有时候需要当手机访问PC站页面时自动跳转到对应的手机站页面. 二.配置 nginx识别手机端跳转到wap 即手机 ...

  4. Nginx配置——区分PC或手机访问不同域名

    新官网上线,但在手机上访问新官网的体验很差,要求在手机上访问新官网时访问旧官网,可以通过修改Nginx配置来实现自动跳转.首先是新官网的Nginx配置文件加个跳转判断,通过user-agent判断来源 ...

  5. Nginx配置——区分PC或手机访问不同域名以及http跳转https

    新官网上线,但在手机上访问新官网的体验很差,要求在手机上访问新官网时访问旧官网,可以通过修改Nginx配置来实现自动跳转.首先是新官网的Nginx配置文件加个跳转判断,通过user-agent判断来源 ...

  6. socket手写一个简单的web服务端

    直接进入正题吧,下面的代码都是我在pycharm中写好,再粘贴上来的 import socket server = socket.socket() server.bind(('127.0.0.1', ...

  7. 【Loadrunner接口测试】什么情况需要区分PC和手机端去做压测?

    1.PC和手机本身访问的都是接口,能有啥不一样的 这个一般看不出来,除非你们开发给APP的接口定义为http://api.mobile.com之类的 网站是网站,APP是APP但是不论是网站还是APP ...

  8. Nginx配置网站适配PC和手机

    考虑到网站的在多种设备下的兼容性,有很多网站会有手机版和电脑版两个版本.访问同一个网站URL,当服务端识别出用户使用电脑访问,就打开电脑版的页面,用户如果使用手机访问,则会得到手机版的页面. 1.判断 ...

  9. Nginx配置站点适配PC和手机

    考虑到站点的在多种设备下的兼容性,有非常多站点会有手机版和电脑版两个版本号.訪问同一个站点URL,当服务端识别出用户使用电脑訪问.就打开电脑版的页面,用户假设使用手机訪问,则会得到手机版的页面. 1. ...

随机推荐

  1. asp.net 远程模型验证

    有这样一些场景,我们需要模型验证,某些字段不允许重复,但是又不希望在数据访问层增加一堆额外逻辑判断.我们需要数据访问层简洁,这种模型验证在进去Action之前,验证不通过直接告诉前端. 一个特性,继承 ...

  2. 【NOI2018】归程 题解(kruskal重构树+最短路)

    题目链接 题目大意:给定一张$n$个点$m$条边的无向图.每条边有长度和海拔.有$Q$次询问,每次给定起点$v$和当天水位线$p$,每次终点都是$1$.人可以选择坐车或走路,车只能在海拔大于水位线的路 ...

  3. 学会这些Python美图技巧,就等着女朋友夸你吧

    一.前言 Python中有许多用于图像处理的库,像是Pillow,或者是OpenCV.而很多时候感觉学完了这些图像处理模块没有什么用,其实只是你不知道怎么用罢了.今天就给大家带了一些美图技巧,让你的图 ...

  4. 一个试图了解JVM内存模型的两年经验的初级程序员,透彻!

    所有的编程语言中都有内存模型这个概念,区别于微架构的内存模型,高级语言的内存模型包括了编译器和微架构两部分.我试图了解了Java.C#和Go语言的内存模型,发现内容基本大同小异,只是这些语言在具体实现 ...

  5. java二进制表示形式与移位操作符

    java二进制表示形式 java中数字的二进制表示形式称为"有符号的二进制补码",下面先介绍原码,反码,补码. 编码 计算方法 原码 用最高位表示符号位,'1'表示负号,'0'表示 ...

  6. Linux根目录下文件夹用途解释

    root目录:主要用于存放root用户相关文件的目录: usr目录:安装一个软件时,linux指定的此软件默认安装的目录: home目录:用于存放普通用户的相关文件的目录:例如:我使用adduser ...

  7. CF 1383B GameGame

    传送门 题目:给定长度为n的数组a,A和B轮流拿走一个数,开始时A和B拥有的v为0,A和B每次拿走一个数时,他的v = v^ ai,A和B都很聪明,问都按照最优的情况考虑,拿完所有数之后A和B的v的大 ...

  8. 关于华为否认HKSP来自官方的一点看法

    今天刷手机,无意看到一则消息: 华为否认提交给 Linux 内核的不安全补丁 HKSP 来自官方 这个消息吸引我的原因有几点: 华为被制裁刚满一年,现在由于新冠疫情影响,感觉又处于很敏感的时期: 华为 ...

  9. Python 用load_workbook 读取excel某个单元格数据、读取excel行数、列数

    from openpyxl import load_workbook path = r'D:\pywork\12' # EXCEL信息所在文件夹 e= load_workbook(path + '/' ...

  10. 前端vue2-org-tree实现精美组织架构图

    最近遇到开发组织架构的需求,与以往开发的组织架构不同,不光要展示人名,还要显示职务(或者子公司名称).对应的头像等,并且要考虑,如果用户未上传头像,需使用默认头像(男.女.中性),(⊙o⊙)…要尊重尊 ...