使用JavaScript判断用户是否为手机设备
最近在做微信服务号开发,其中遇到一个问题是微信服务号查看的个人的消息,如果点击在浏览器中查看(iOS中是在Safari中打开)应该是跳转到登录页面,因为页面需要从后台获取,因为需要服务端判断,如果是存页面不需要后台数据可以在前台进行判断,因为后台是NodeJS,所以给出客户端和服务端两个版本的代码供参考。
客户端判断
方法很简单,就是通过userAgent去判断,先判断是否为移动端,可以判断是iOS终端和Android终端,也可以具体到应用进行判断微信,微博,qq访问:
var browser = {
versions: function() {
var u = navigator.userAgent,
ua = navigator.userAgent.toLowerCase();
return { //移动终端浏览器版本信息
trident: u.indexOf('Trident') > -1, //IE内核
presto: u.indexOf('Presto') > -1, //opera内核
webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或uc浏览器
iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
iPad: u.indexOf('iPad') > -1, //是否iPad
webApp: u.indexOf('Safari') == -1 ,//是否web应该程序,没有头部与底部
wechat:ua.match(/MicroMessenger/i) == "micromessenger",//微信
weibo:ua.match(/WeiBo/i) == "weibo",//微博
qq:ua.match(/QQ/i) == "qq"//qq
};
}(),
language: (navigator.browserLanguage || navigator.language).toLowerCase()
};
console.log(navigator.userAgent);
服务端判断
NodeJS同样也是通过userAgent判断,代码如下:
var browser= function(req) {
var u = req.headers['user-agent'];
var ua = u.toLowerCase();
//移动终端浏览器版本信息
return {
trident: u.indexOf('Trident') > -1, //IE内核
presto: u.indexOf('Presto') > -1, //opera内核
webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或uc浏览器
iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
iPad: u.indexOf('iPad') > -1, //是否iPad
webApp: u.indexOf('Safari') == -1, //是否web应该程序,没有头部与底部
wechat: ua.match(/MicroMessenger/i) == "micromessenger",//微信
weibo: ua.match(/WeiBo/i) == "weibo",//微博
qq: ua.match(/QQ/i) == "qq"//QQ空间
};
};
exports.browser=browser;
基本的判断都有,可以根据判断的结果给出不同的响应~
使用JavaScript判断用户是否为手机设备的更多相关文章
- JavaScript 判断用户输入的邮箱及手机格式是否正确
JavaScript判断用户输入的邮箱格式是否正确.判断用户输入的手机号格式是否正确,下面有个不错的示例,感兴趣的朋友可以参考下. 复制代码代码如下: /* * 功能:判断用户输入的邮箱格式是否正确 ...
- html5判断用户摇晃了手机(转)
先来看下html5的这几个特性: 1.deviceOrientation:方向传感器数据的事件,通过监听该事件可以获取手机静态状态下的方向数据: 2.deviceMotion: 运动传感器数据事件,通 ...
- php网站判断用户是否是手机访问的方法
PHP网站判断用户是否用手机访问,如果是手机的话,就跳转到指定的手机友好页面.随着移动设备的普及,网站也会迎来越来越多移动设备的访问.用适应PC的页面,很多时候对手机用户不友好,那么有些时候,我们需要 ...
- JavaScript判断用户是通过电脑端还是移动端访问
每个浏览器对应的useragent不同,JavaScript通过判断useragent的类型,便可以判断出用户所使用的浏览器类型,包括 IE.Firefox.chrome等.还可以判断用户是否通过移动 ...
- PHP和javascript判断用户使用的是手机还是电脑
PHP判断手机还是电脑 <?php $is_mobile = (is_mobile() == true) ? "手机" : "电脑"; echo '< ...
- web首页设置如下代码可判断用户是用什么设备登录的?
var OnePage=true;//用来判断staticHtml.js中首页登入的信息判断var _mobileUrl = "http://a.abc.com";//手机用户通过 ...
- JavaScript经典代码【二】【javascript判断用户点了鼠标左键还是右键】
IE 下 onMouseDown 事件有个 events.button 可以返回一个数值,根据数值判断取得用户按了那个鼠标键 events.button==0 默认.没有按任何按钮. events.b ...
- javascript判断页面是否在移动设备上打开
var ua = navigator.userAgent; var ipad = ua.match(/(iPad).*OS\s([\d_]+)/), isIphone =!ipad && ...
- 使用UAParser在C#MVC项目中如何判断用户是在用什么设备进行访问(手机,平板还是普通的电脑)
现在我们开发的很多web应用都要支持手机等移动设备.为了让手机用户能有更加好的用户体验,我们经常为手机设备专门准备一套前端的页面.这样当用户使用普通电脑来访问的时候,我们的应用就向用户展示普通电脑的页 ...
随机推荐
- Atitit. 高级软件工程师and 普通的区别 高级编程的门槛总结
Atitit. 高级软件工程师and 普通的区别 高级编程的门槛总结 1. 完备的知识体系 2 2. 编程理论/原理的掌握 2 1.1. 掌握常用的概念(ORM,IOC,AOP,event driv ...
- paip.执行shell cmd 命令uapi java php python总结
paip.执行shell cmd 命令uapi java php python总结 作者Attilax 艾龙, EMAIL:1466519819@qq.com 来源:attilax的专栏 地址:h ...
- java集合类的学习总结一
概况总结 首先,区分最顶层接口的区别:Collection和Map的区别:前者是单个元素:后者存储的是一对元素.Collection有List和Set两个子接口,两个子接口下分别有Vector和Arr ...
- Java性能提示(全)
http://www.onjava.com/pub/a/onjava/2001/05/30/optimization.htmlComparing the performance of LinkedLi ...
- C#代码像QQ的右下角消息框一样,无论现在用户的焦点在哪个窗口,消息框弹出后都不影响焦点的变化,那么有两种方法
你QQ的右下角消息框一样,无论现在用户的焦点在哪个窗口,消息框弹出后都不影响焦点的变化,那么有两种方法: 要么重写需要弹出的窗体的事件: protected override CreateParams ...
- APK重签名总结
keytool -genkey -alias aeo_android.keystore -keyalg RSA -validity 20000 -keystore aeo_android.keysto ...
- 闲聊Redshift与日本CG行业的近况
最近不少朋友跟我说Redshift如何如何,恰巧我目前工作的工作室花费了巨资购买了Redshift和Quadro M4000,妄图在艺术家工作站上做一个新的动画项目,把渲染时间控制在15分钟以下.结果 ...
- Service Station - An Introduction To RESTful Services With WCF
Learning about REST An Abstract Example Why Should You Care about REST? WCF and REST WebGetAttribute ...
- ASP.NET MVC 分部视图
@model PartViewDemo.Models.HomeInfo@using PartViewDemo.Models;@{ ViewBag.Title = "Index";} ...
- 判断big endian和little endian的方法
http://blog.sina.com.cn/s/blog_6ab0b9a80101awzr.html 不同体系的CPU在内存中的数据存储往往存在着差异.例如,Intel的x86系列处理器将低序 ...