How to use JavaScript to determine several common browsers through userAgent

Preface

Usually when making h5 pages, you need to do some traffic diversion work within the WeChat, QQ, Weibo and other ecosystems, but the traffic diversion is limited by these platforms. For example, the last article "h5 wake-up app implementation and points to note" is a compromise. So what are the User Agents of these commonly used browsers like? How to judge? Let’s take a closer look at this issue today.

User Agent Definition

User Agent is the Chinese name for User Agent, abbreviated as UA. It is a special string header that enables the server to identify the operating system and version, CPU type, browser and version, browser rendering engine, browser language, browser plug-ins, etc. used by the client. ---From Baidu Encyclopedia

From this sentence, we can know that we can obtain information such as the operating system and version, CPU type, browser and version used by the user through UA, right?

Several common browser UA

Only WeChat, Weibo, QQ and other browsers are obtained here. The rest are not obtained yet. If you have any additions, please send a private message or leave a comment.

Android

The Android version currently used is Huawei Honor V9 Play, the current Android system version is 7.0 and the EMUI version is 5.1.

QQ Browser

• UA: mozilla/5.0 (linux; u; android 7.0; zh-cn; jmm-al10 build/honorjmm-al10) applewebkit/537.36 (khtml, like gecko) version/4.0 chrome/66.0.3359.126 mqqbrowser/9.6 mobile safari/537.36
• Version：9.6.0.5170

QQ

• UA：mozilla/5.0 (linux; android 7.0; jmm-al10 build/honorjmm-al10; wv) applewebkit/537.36 (khtml, like gecko) version/4.0 chrome/62.0.3202.84 mobile safari/537.36 v1_and_sq_8.1.0_1232_yyb_d qq/8.1.0.4150 nettype/wifi webp/0.4.1 pixel/720 statusbarheight/49 simpleuiswitch/0
• Version：8.1.0.4150

WeChat

• UA: mozilla/5.0 (linux; android 7.0; jmm-al10 build/honorjmm-al10; wv) applewebkit/537.36 (khtml, like gecko) version/4.0 chrome/66.0.3359.126 mqqbrowser/6.2 tbs/044807 mobile safari/537.36 mmwebid/4093 micromessenger/7.0.6.1460(0x27000634) process/tools nettype/wifi language/zh_cn
• Version：7.0.6

Weibo

• UA：mozilla/5.0 (linux; android 7.0; jmm-al10 build/honorjmm-al10; wv) applewebkit/537.36 (khtml, like gecko) version/4.0 chrome/62.0.3202.84 mobile safari/537.36 weibo (huawei-jmm-al10__weibo__9.8.0__android__android7.0)
• Version：9.8.0

apple

Apple currently uses iPhone 6s Plus, and the current iOS version is 12.4.

QQ Browser

• UA: mozilla/5.0 (iphone; cpu iphone os 12_4 like mac os x) applewebkit/605.1.15 (khtml, like gecko) version/12.0 mqqbrowser/9.6.0 mobile/15e148 safari/604.1 qbwebviewua/2 qbwebviewtype/1 wktype/1
• Version：9.6.0.4193

QQ

• UA：mozilla/5.0 (iphone; cpu iphone os 12_4 like mac os x) applewebkit/605.1.15 (khtml, like gecko) mobile/15e148 qq/8.1.0.437 v1_iph_sq_8.1.0_1_app_a pixel/1080 core/wkwebview device/apple(iphone 6splus) nettype/wifi qbwebviewtype/1 wktype/1
• Version：8.1.0.437

WeChat

• UA: mozilla/5.0 (iphone; cpu iphone os 12_4 like mac os x) applewebkit/605.1.15 (khtml, like gecko) mobile/15e148 micromessenger/7.0.5(0x17000523) nettype/wifi language/zh_cn
• Version：7.0.5

Weibo

• UA: mozilla/5.0 (iphone; cpu iphone os 12_4 like mac os x) applewebkit/605.1.15 (khtml, like gecko) mobile/15e148 weibo (iphone8,2__weibo__9.7.1__iphone__os12.4)
• Version：9.7.1

All the above UA values ​​are processed by toLowerCase, so they are all lowercase.

Determine several commonly used browsers separately

Before judging, you need to do an operation on UA, which is to convert all letters into lowercase, which can be achieved through toLowerCase, and then judge them separately.

It is actually very easy to judge through the above UAs. There is already a way to write this in the last article, as follows:

/micromessenger/i.test(u) // Check WeChat u.indexOf("weibo") > -1 // Check Weibo u.indexOf("qq") > -1 // Check QQ
u.indexOf("mqqbrowser") > -1 // Determine QQ browser

Note that QQ requires a space before qq.

Get additional information

It is not difficult to see from the above UA that the current system can be determined by UA, whether it is Android or iOS, which can be distinguished by the following code:

/android/i.test(UA) //Judge Android
/(iPhone|iPad|iPod|iOS)/i.test(UA) //Judge iOS

The above data also shows the specific type of mobile phone, which I will not introduce in detail here. In addition, many mobile browsers can change UA, such as Quark and UC. If you study it in depth, you can get more information.

Summarize

This concludes this article on how JavaScript can determine several commonly used browsers through userAgent. For more relevant JS userAgent browser determination content, please search 123WORDPRESS.COM's previous articles or continue to browse the following related articles. I hope everyone will support 123WORDPRESS.COM in the future!