| |
Client Side's Detection |
|
|
Subject: Client Side's Detection
Author: WebSpider
In response to: How to detect if a quest to my site is from iphone, adroid or any other mobile device?
Posted on: 02/08/2011 02:45:57 PM
The detection can be done on the client side by embedded JavaScript. Here is a example:
http://www.forumeasy.com/forums/thread.jsp?tid=129713135889&fid=javaprof25
>
> On 02/07/2011 08:26:32 PM WebSpider wrote:
With mobile devices like smart phone getting more and more popular, it's not uncommon that a traditional website which have been designed for desktop device is seeing a surge traffic from mobile devices. The layout of website contents which have been suit perfectly for the bigger desktop monitors is getting ugly to squeeze everything inside the tiny window. Sooner or later you, as a website administrator, need a way to tell where an incoming traffic is coming from and then to serve the request with customized content layout.
Upon a incoming request, let's say http://www.example.com:8080/usa/index.html the server will have more information about the client than just the URI /usa/index.html. Here are just some of them:
GET /usa/index.html HTTP/1.0
Connection: Keep-Alive
If-Modified-Since: Tuesday, 07-Feb-11 20:56:34 GMT; length=873
User-Agent: Mozilla/4.05 (compatible; MSIE 8.0; Windows NT 5.1)
Host: www.example.com:8080
Accept: image/gif, image/jpeg, image/png, */*
Accept-Language: en
Accept-Charset: iso-8859-1,*,utf-8
Cookie: jsessionid=ADADJKDADAHHKBGHD98AAA
The code is very simple. All you have to do is to check User-Agent header that most browsers send along with each request. The header usually describes the specific type and version of the browser, togther with device information.
From desktop IE browser:
User-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; GTB6.6; .NET CLR 1.1.4322; CIBA; Alexa Toolbar; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729)
From iPhone browser:
User-Agent: Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en)
AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1C25 Safari/419.3
From Android browser:
User-Agent: Mozilla/5.0 (Linux; U; Android 2.1-update; en-us; SPH-M910 Build/ECLAIR) AppleWebKit/530.17(KHTML, like Gecko) Version/4.0 Mobile Safari/530.17
Here is the JSP code:
<%
String user_agent = request.getHeader( "User-Agent" );
boolean isFirefox = user_agent !=null && user_agent.indexOf("Firefox/") != -1);
boolean isMSIE = (user_agent != null && user_agent.indexOf("MSIE") != -1);
boolean isIphone = (user_agent != null && user_agent.indexOf("iPhone") != -1);
boolean isAndroid = (user_agent != null && user_agent.indexOf("Android") != -1);
boolean isMobile = (user_agent != null && user_agent.indexOf("Mobile") != -1);
if(isMobile){
if(isIphone){
%>Contents 4 iPhone<%
}else if(isAndroid){
%>Contents 4 Android<%
}else{
%>Contents 4 Ohter Mobile Devices<%
}
}else{
%>Contents 4 Desktop Devices<%
}
%>
References:
|
|
|
|
