We have salesforce lightning app which runs on both mobile and desktop. Need to write some code only for mobile application. How to detect whether app is running on a mobile browser or desktop browser? I used following code but its not working:

checkMobileBrowser: function(ponent){
    if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)){
        return true;        
    }else{
        return false;
    }
}

We have salesforce lightning app which runs on both mobile and desktop. Need to write some code only for mobile application. How to detect whether app is running on a mobile browser or desktop browser? I used following code but its not working:

checkMobileBrowser: function(ponent){
    if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)){
        return true;        
    }else{
        return false;
    }
}

• javascript
• css
• browser
• salesforce
• ie8-browser-mode

3 Answers 3

The $Browser global value provider returns information about the hardware and operating system of the browser accessing the application.

Returns a FormFactor enum value based on the type of hardware the browser is running on.

DESKTOP for a desktop client PHONE for a phone including a mobile phone with a browser and a smartphone TABLET for a tablet client (for which isTablet returns true)

Ctrl

({
    checkBrowser: function(ponent) {
        var device = $A.get("$Browser.formFactor");
        alert("You are using a " + device);
    }
})
Component

<aura:ponent>
        {!$Browser.isTablet}
        {!$Browser.isPhone}
        {!$Browser.isAndroid}
        {!$Browser.formFactor}
    </aura:ponent>

By using this way you can determine

Resource: http://www.janbask./salesforce-lightning

You can also use the $Browser global value provider:

function checkMobileBrowser(){ 
   return $A.get("$Browser.formFactor") !== "DESKTOP"
}

This will ensure that your detection matches what the application uses, if your ponent is ever embedded in S1 or SFX, and everything will switch on the same logic.

$Browser is also available in ponent markup:

<aura:if "{!$Browser.formFactor !== 'DESKTOP'}">
   <ponent/>
</aura:if> 

You might want to search the documentation for $Browser, because it allows for very granular hardware detection, and there might be something else for your specific use case.

https://resources.docs.salesforce./sfdc/pdf/lightning.pdf

you can write JavaScript function for validation of browser's user agent:

function detectmob(){ 
    if(navigator.userAgent.match(/Android/i)
            || navigator.userAgent.match(/webOS/i)
            || navigator.userAgent.match(/iPhone/i)
            || navigator.userAgent.match(/iPad/i)
            || navigator.userAgent.match(/iPod/i)
            || navigator.userAgent.match(/BlackBerry/i)
            || navigator.userAgent.match(/Windows Phone/i)){
        return true;
    }else{
        return false;
    }
}