Automatically detect user device when entering the site

Discussion in 'JavaScript' started by Elijah45, Feb 25, 2020.

0
  1. #1
    Hello everyone!

    I want to create site. When user entering on my website from iOS, i'll show him a link to app my website in App Market . When user entering on my website from Android, i'll show him a link to app my website in Play Market.

    I searched the internet for examples and found only one https://iq-option.trade/
    Please, help me.
     
    Elijah45, Feb 25, 2020 IP
  2. Elijah45

    Elijah45 Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #2
    I used this version
    but its not working
     
    Elijah45, Feb 25, 2020 IP
  3. sarahk

    sarahk iTamer Staff

    Messages:
    28,806
    Likes Received:
    4,534
    Best Answers:
    123
    Trophy Points:
    665
    #3
    A quick google comes up with a few choices. This one looks good.
    
var isMobile ={
Android:function(){
   return navigator.userAgent.match(/Android/i);
},
BlackBerry:function(){
return navigator.userAgent.match(/BlackBerry/i);
},
iOS:function(){
   return navigator.userAgent.match(/iPhone|iPad|iPod/i);
},
Opera:function(){
   return navigator.userAgent.match(/Opera Mini/i);
},
Windows:function(){
   return navigator.userAgent.match(/IEMobile/i);
},
any:function(){
   return(isMobile.Android()|| isMobile.BlackBerry()|| isMobile.iOS()|| isMobile.Opera()|| isMobile.Windows());
}
};

if(isMobile.any()){
window.location ="#";}
    Code (javascript):
     
    sarahk, Feb 25, 2020 IP
  4. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #4
    Can't say I'm wild about it, but that's because if you call any of the methods more than once, particularly the "any" method, it becomes inefficient since it's running it every time, instead of just determining it once at the start.

    Be more useful if it just set a variable on startup.

    
var
	isMobile = navigator.userAgent.match(/Android/i) ? 'Android : (
		navigator.userAgent.match(/BlackBerry/i) ? 'Blackberry' : (
			navigator.userAgent.match(/iPhone|iPad|iPod/i) ? 'iOS' : (
				navigator.userAgent.match(/Opera Mini/i) ? 'Opera' : (
					navigator.userAgent.match(/IEMobile/i) ? 'Windows' : false
				)
			)
		)
	);
	
if (isMobile == 'iOS') {
	// add your IOS button here
}
    Code (markup):
    For "any" just "if (isMobile)"... and for none of course it's !isMobile. Lets us leverage JS' loose comparison for something good. For a change...
     
    deathshadow, Feb 28, 2020 IP
  5. qwikad.com

    qwikad.com Illustrious Member Affiliate Manager

    Messages:
    7,278
    Likes Received:
    1,696
    Best Answers:
    31
    Trophy Points:
    475
    #5
    How reliable this thing is and why would anyone want to do this? Isn't it much better to just make your site responsive / fluid and then show buttons to appropriate apps in the footer?
     
    qwikad.com, Feb 28, 2020 IP
  6. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #6
    Normally I'd agree with you 100%, but given he's linking to the different stores for each platform, it's probably not a horrible idea to have these (optional?) links generated in the scripting to the appropriate one. No sense having the link to Google Play show up on the iPhone, or having the App store show up on Android... or the Microsoft store for either. (a third option)

    Usually browser sniffing is a bad thing, but this is one of those rare cases where IMHO it makes more sense than showing the links when they just don't apply for the user.

    That said I'd show both links on Opera Mini, since it could be EITHER platform.
     
    deathshadow, Feb 28, 2020 IP
    sarahk likes this.
  7. sarahk

    sarahk iTamer Staff

    Messages:
    28,806
    Likes Received:
    4,534
    Best Answers:
    123
    Trophy Points:
    665
    #7
    Agreed, it's rare that code snippets get used "as is". Definitely a good idea to do it once and store the result.
     
    sarahk, Feb 28, 2020 IP