How does js determine whether users are accessing it on PC or mobile
- 2020-03-30 02:42:18
- OfStack
Recently I have been working on our team's project "coffee wings", in which we provide an excellent experience for mobile platforms. With the booming development of Android platform. It not only drives the domestic smartphone industry, but also many domestic developers have started to jump into the big wave of Android mobile terminals. If a lot of the Internet big wave you missed. Then you can't miss this Android wave. At present, we have developed mobile terminal and Android client for "coffee wing". If you use Android or IOS operating system, you can directly visit the domain name www.sygxy.cn to watch the effect of mobile terminal. At the same time, the Android client has been launched to tencent "app treasure" and "baidu mobile assistant" and other app stores. You can download it by searching for "coffee wings". In the absence of any promotion, it has been on the shelves for only a week and has already had more than 100+ downloads.
If you want to optimize the mobile terminal, all you have to do is determine what the client's access device is. As a result of this determination, the domain name address cannot be returned, and then different CSS files are loaded.
The judgment method we use is to judge by the user-agent value. Use the userAgent property of the Navigator object in the javascript framework. There is no public standard for the navigator object, but it is now supported by all browsers on the market. Returns the value of the user-agent header sent to the server by the client using the userAgent property. There is a user-agent in the header that tells the server what browser the client is in and what the operating system is. Regular expressions are used to obtain user-agent values. The matching value can be a mobile operating system such as Android,ios, or the name of the browser. There is a match will jump, otherwise will not jump, directly into the PC end home page.
Specific code implementation, we in order to improve the portability of the site, the use of JavaScript scripting language. There are two benefits to using this technique in my opinion
1: it can improve the portability of the website. If our team needs to add the effect of mobile terminal again in the following Web project, we can easily introduce this part of JS code to judge. Improve future work efficiency.
2: the second point is that the Web program can be loaded in different interface, whether to introduce this part of the mobile terminal judgment code.
Specific implementation:
We take away the script that determines access, and if a page needs to be judged by the client terminal, we use it directly on the page. Script> < / script> Introduction of script, the specific judgment code is as follows:
If you want to optimize the mobile terminal, all you have to do is determine what the client's access device is. As a result of this determination, the domain name address cannot be returned, and then different CSS files are loaded.
The judgment method we use is to judge by the user-agent value. Use the userAgent property of the Navigator object in the javascript framework. There is no public standard for the navigator object, but it is now supported by all browsers on the market. Returns the value of the user-agent header sent to the server by the client using the userAgent property. There is a user-agent in the header that tells the server what browser the client is in and what the operating system is. Regular expressions are used to obtain user-agent values. The matching value can be a mobile operating system such as Android,ios, or the name of the browser. There is a match will jump, otherwise will not jump, directly into the PC end home page.
Specific code implementation, we in order to improve the portability of the site, the use of JavaScript scripting language. There are two benefits to using this technique in my opinion
1: it can improve the portability of the website. If our team needs to add the effect of mobile terminal again in the following Web project, we can easily introduce this part of JS code to judge. Improve future work efficiency.
2: the second point is that the Web program can be loaded in different interface, whether to introduce this part of the mobile terminal judgment code.
Specific implementation:
We take away the script that determines access, and if a page needs to be judged by the client terminal, we use it directly on the page. Script> < / script> Introduction of script, the specific judgment code is as follows:
function uaredirect(f){
try{if(
document.getElementById("bdmark")!=null){
return
}
var b=false;
if(arguments[1]){
var e=window.location.host;var a=window.location.href;
if(isSubdomain(arguments[1],e)==1){
f=f+"/#m/"+a;b=true}else{if(isSubdomain(arguments[1],e)==2){f=f+"/#m/"+a;b=true}
else{f=a;b=false}}}
else{b=true}if(b){var c=window.location.hash;
if(!c.match("fromapp")){
if((navigator.userAgent.match(/(iPhone|iPod|Android|ios|Windows Phone)/i))){location.replace(f)}}}}catch(d)<br> {<br> }<br>}