preface

When we do user authorization login (wechat, QQ authorization), and do the corresponding operation according to the corresponding browser, we often meet the need to judge the needs of the browser used by the user, and when the user input information, there are some regulars that need to be verified. If you like, you can click Bozam/follow, support, hope you can have a harvest after reading this article.

Personal blog: obkoro1.com

Determine the user’s browser

navigator.userAgent

The main API used to determine which browser a user is using is navigator.userAgent, which is a read-only string that declares the value of the userAgent header used by the browser for HTTP requests. UserAgent values vary from browser to browser. So we can use this string to determine which browser the user is coming from.

Judgment method:

The following two values are obtained from the demo we just made. If you look closely at the following two strings, you will find that some values are different and browser-specific. Based on this, we can use this as a judgment criterion for different browsers.

UserAgent value of QQ built-in browser:

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.422v1_iPH_SQ_7.5.8_1_APP_A Pixel /1080 Core/UIWebView Device/Apple (iPhone 8Plus) nettype/wifi qbwebviewtype/1

UserAgent value of wechat built-in browser:

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

The sample

Use this API to read the value directly, and then observe the differences in the userAgent string in advance to determine:

let url = navigator.userAgent.toLowerCase(); If (url.indexof ("15b202 QQ ") > -1) {// Separate check qq built-in browser alert(" qq APP built-in browser, do what you want to do "); } if (url.indexof ("micromessenger") > -1) {// Check the alert(' dO what you want to do '); } if (url.indexof ("15b202") > -1) {// check if (url.indexof ("15b202") > -1) {// check if (url.indexof ("15b202") > -1) }Copy the code

If there are more different requirements, you can follow the above method to obtain the string of userAgent first, and then use indexOf to determine whether the specified character is contained based on observation to perform different operations for different browsers.

A portion of the re determines user input

Regular expressions are often used to verify that the user’s input is in compliance with the specification, in order to avoid the user’s passing the validation. This part of the content is basically collected on the Internet, here to share with you, if there is a need can be recorded in their own Youdao cloud.

How to verify?

Of course, there are many ways to verify, and the test() method is recommended.

let isTrue=RegExpObject.test(string); // RegExpObject is the string to detect. // Return true if the string contains text that matches RegExpObject, false otherwise. If (isTrue){// do something}elseP{// do something}Copy the code

Id card number regular expression:

The first generation id card has only 15 digits, the second generation ID card has 18 digits, you choose the expression according to the demand.

/ / the number of the second generation id card regular 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} [xx] 0-9 $/; The first generation id card / / regular expressions (15) let isTrue = / ^ 1-9] [\ d {7} ((0 \ d) | (1) [0-2]) ((\ [0 | 1 | 2] d) | 3 [0, 1]) \ d {3} $/;Copy the code

Mobile phone number regular expression:

Deadline: January 11, 2018

Mobile number: 134 135 136 137 138 139 147 148 150 151 152 157 158 159 172 178 182 183 184 187 188 198

Unicom number segment: 130 131 132 145 146 155 156 166 171 175 176 185 186

Telecommunication number: 133 149 153 173 174 177 180 181 189 199

Virtual carrier: 170

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

Mailbox regular expression:

Let isTrue = / ^ ([A Za - z0-9 _ \ - \ \ u4e00 - \ u9fa5]) + \ @ ([A - Za - z0-9 _ \ - \]) + \. ([A Za - z] {8} 2) $/;Copy the code

User name is regular:

//// user name regular, 4 to 16 characters (letters, digits, underscores, minus signs) let isTrue = /^[A-za-z0-9_ -]{4,16}$/;Copy the code

Password regular:

The password must start with a letter and contain 6 to 18 letters, digits, and underscores (_)

Let isTrue = ^ \ w [a zA - Z] {5} in 2 $.Copy the code

A strong password contains at least six characters, including at least one uppercase letter, one lowercase letter, one digit, and one special character

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

QQ number regular:

Let isTrue = / ^ (1-9] [0-9] {4, 10} $/;Copy the code

Wechat number regular:

/ / WeChat ID regular, 6 to 20, begin with a letter, letters, Numbers and minus sign, underline the let isTrue = / ^ [a zA - Z] ([9] - _a - zA - Z0 - {5} 3) + $/;Copy the code

Special character detection re:

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

Domain name re:

Let isTrue = [a zA - Z0-9] [9] - a - zA - Z0 - on conversion {0} (/. [a zA - Z0-9] [9] - a - zA - Z0 - on conversion {0}) + /.? ;Copy the code

License plate number re:

[a-z]{1}[a-z]{1}[a-z]{1}[a-z]{2}[a-z0-9]{4}[a-z0-9]{1}$/;Copy the code

Contains Chinese re:

let isTrue = /[\u4E00-\u9FA5]/; // This can be used to verify the user's real name.Copy the code

Passport regular:

Let isTrue = / ^ (P \ d {7} {7, 8} \ | G d | TH \ d \ d {7, 8} | S | A \ d {7, 8} {7, 8} {7, 8} | | L \ d \ d {9} \ d + | 1 | d (4, 5] \ d {7}) $/;Copy the code

Fixed phone regular:

Let isTrue = (\ (\ d {3, 4} \ | \ d {3, 4} - | \ s)? \d{8};Copy the code

Regular IP address:

let isTrue=\d+\.\d+\.\d+\.\d+;
Copy the code

Zip code re:

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

Longitude and latitude regularity

/ / longitude regular let isTrue = / ^ (\ | \ +)? (((\ d | \ [1-9] d | 1 [0] \ d {1, 3}) | 0 \. \ d {0, 6}) | | (\ d \ d [1-9] 1 [0] \ | d | 0 {1, 3}) | 180 \. 0 {0, 6} | 180) $/; / / latitude regular let isTrue = / ^ (\ | \ +)? ([0 to 8]? \ d {1} \ \ d {0, 6} \ | 90. 0 {0, 6} | 0 to 8]? \d{1}|90)$/;Copy the code

These are some of the most commonly used regular expressions. If you have any more, please share them in the comments section.

conclusion

The above is the content of this article, I hope you can have a harvest after reading, if you like, quickly click wave subscribe attention/like, convenient to find copy and paste, 233.

I hope the friends can click like/follow, your support is the biggest encouragement to me.

Finally: if need to reprint, please put the original link and signature. Code word is not easy, thank you for your support! I write articles in line with the mentality of exchange records, write bad place, do not quarrel, but welcome to give directions.

Personal blog and Nuggets personal homepage

If you like this article, you can pay attention to my newly opened subscription number to learn and grow together.

The above 2018.5.5

References:

HTML DOM userAgent attribute

The JavaScript test () method

2018 Latest mobile phone number regular expression

Regular expression of id number

JavaScript mobile phone number format verification method

Mailbox/mail address regular expression and analysis

The front-end form validates 15 commonly used JS regular expressions

Front-end development of regular expression and regular expression daquan

Regular expression for password strength