如何判断用户浏览器以及一些前端常用的正则表单验证

摘要：前言在我们做用户授权登录微信授权，以及根据对应浏览器做对应的操作的时候，经常会遇到需要判断用户使用的浏览器的需求，以及在需要用户输入信息的时候，有需要验证的一些正则。

在我们做用户授权登录(微信,qq授权)，以及根据对应浏览器做对应的操作的时候，经常会遇到需要判断用户使用的浏览器的需求，以及在需要用户输入信息的时候，有需要验证的一些正则。如果喜欢的话可以点波赞/关注，支持一下，希望大家看完本文可以有所收获。

个人博客了解一下：obkoro1.com

判断用户所使用的浏览器主要用到的api是navigator.userAgent，这是一个只读的字符串，声明了浏览器用于 HTTP 请求的用户代理头的值，不同浏览器的userAgent值都不相同，所以我们可以根据这个字符串来判断用户是从哪个浏览器进入的。

下面两个是刚做的demo获取的值，仔细观察下面两个字符串，会发现有些值是不一样的，并且浏览器特有的，依据这个我们就可以作为不同浏览器的判断条件。

mozilla/5.0 (iphone; cpu iphone os 11_1_2 like mac os x) applewebkit/604.3.5 (khtml, like gecko) mobile/15b202 qq/7.5.8.422 v1_iph_sq_7.5.8_1_app_a pixel/1080 core/uiwebview device/apple(iphone 8plus) nettype/wifi qbwebviewtype/1

mozilla/5.0 (iphone; cpu iphone os 11_1_2 like mac os x) applewebkit/604.3.5 (khtml, like gecko) mobile/15b202 micromessenger/6.6.6 nettype/wifi language/zh_cn

使用方式，直接使用这个api读取值，然后根据事先观察userAgent字符串的不同之处来判断：

let url = navigator.userAgent.toLowerCase();
//使用toLowerCase将字符串全部转为小写 方便我们判断使用
if (url.indexOf("15b202 qq") > -1) {
  //多带带判断QQ内置浏览器 
  alert("QQ APP 内置浏览器，做你想做的操作");
}
if (url.indexOf("micromessenger") > -1) {
  //多带带判断微信内置浏览器
  alert("微信内置浏览器，做你想做的操作");
}
if (url.indexOf("15b202") > -1) {
  //判断微信内置浏览器，QQ内置浏览器
  alert("QQ和微信内置浏览器，做你想做的操作");
}

上面判断了微信和QQ的内置浏览器，如果有更多不同的需求的话，可以按照上面的方式，先获取userAgent的字符串，然后再根据观察，使用indexOf判断是否含有指定的字符，来对不同浏览器进行不同的操作。

为了避免用户胡乱输入就通过验证，很多时候我们都会采用正则表达式来验证一下用户输入的信息是否符合规范。这部分的内容基本上是在网上收集来的，这里跟大家一起分享一下，有需要的可以记在自己的有道云里面。

验证的方式当然是很多了，这里推荐采用test()方法来验证。

   let isTrue=RegExpObject.test(string);// RegExpObject为正则 string是要检测的字符串
   // 如果字符串 string 中含有与 RegExpObject 匹配的文本，则返回 true，否则返回 false。
   if (isTrue){
       //验证成功 do something
   }elseP{
       //验证失败
   }

第一代身份证只有15位数，第二代身份证有18位数，各位按照需求来选择表达式。

//第二代身份证号码正则
let isTrue = /^[1-9]d{5}(18|19|20)d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)d{3}[0-9Xx]$/;
//第一代身份证正则表达式(15位)
let isTrue=/^[1-9]d{7}((0d)|(1[0-2]))(([0|1|2]d)|3[0-1])d{3}$/;

时间截止为：2018年1月11日

移动号段：134 135 136 137 138 139 147 148 150 151 152 157 158 159 172 178 182 183 184 187 188 198

联通号段：130 131 132 145 146 155 156 166 171 175 176 185 186

电信号段：133 149 153 173 174 177 180 181 189 199

虚拟运营商：170

    let isTrue = /^(13[0-9]|14[5-9]|15[012356789]|166|17[0-8]|18[0-9]|19[8-9])[0-9]{8}$/;  

let isTrue =/^([A-Za-z0-9_-.u4e00-u9fa5])+@([A-Za-z0-9_-.])+.([A-Za-z]{2,8})$/;

////用户名正则，4到16位（字母，数字，下划线，减号）
let isTrue = /^[a-zA-Z0-9_-]{4,16}$/;

密码正则，以字母开头，长度在6~18之间，只能包含字母、数字和下划线

let isTrue =^[a-zA-Z]w{5,17}$;

强密码正则，最少6位，包括至少1个大写字母，1个小写字母，1个数字，1个特殊字符

let isTrue = /^.*(?=.{6,})(?=.*d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/;

let isTrue = /^[1-9][0-9]{4,10}$/;

//微信号正则，6至20位，以字母开头，字母，数字，减号，下划线
let isTrue = /^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$/;

   let isTrue= /[""<>%;)(&+]+-!！@#$~/;

let isTrue=[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(/.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+/.?;    

let isTrue = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/;

let isTrue = /[u4E00-u9FA5]/;
//这个可以用于验证用户的真实姓名。

let isTrue=/^(Pd{7}|Gd{7,8}|THd{7,8}|Sd{7,8}|Ad{7,8}|Ld{7,8}|d{9}|Dd+|1[4,5]d{7})$/;

let isTrue=((d{3,4})|d{3,4}-|s)?d{8};

let isTrue=d+.d+.d+.d+;

let isTrue=[1-9]{1}(d+){5};

//经度正则
 let isTrue=/^(-|+)?(((d|[1-9]d|1[0-7]d|0{1,3}).d{0,6})|(d|[1-9]d|1[0-7]d|0{1,3})|180.0{0,6}|180)$/;
 //纬度正则
 let isTrue=/^(-|+)?([0-8]?d{1}.d{0,6}|90.0{0,6}|[0-8]?d{1}|90)$/;

常用的正则表达式大概就是上面这些了，如果大家还有其他干货的话，欢迎在评论区留言分享一下。

以上就是本文的内容了，希望大家看完可以有所收获，喜欢的话，赶紧点波订阅关注/喜欢，以后方便查找复制粘贴，233。

最后：如需转载，请放上原文链接并署名。码字不易，感谢支持！本人写文章本着交流记录的心态，写的不好之处，不撕逼，但是欢迎指点。

个人blog and 掘金个人主页

如果喜欢本文的话，可以关注一下我刚开的订阅号，共同学习成长。

以上2018.5.5

HTML DOM userAgent 属性

JavaScript test() 方法

2018最新手机号码正则表达式

身份证号码的正则表达式

JavaScript手机号码格式验证方法

邮箱/邮件地址的正则表达式及分析

前端表单验证常用的15个JS正则表达式

前端开发中的 正则表达式 及常用正则表达式大全

密码强度的正则表达式