Forum Discussion

catherine_OTX's avatar
14 years ago

Browser/Device detection with Freemarker

Hi, we would like to create some custom components that won't work properly in some older browsers, like ie 6. Is there any way we can use freemarker to detect the browser type?

  • Freemarker lets you grab HTTP headers, so you could do something with User-Agent:

     

    <#assign ua = http.request.getHeader("User-Agent") />

     

  • I know this is a super old thread, but I wanted to share some info that will hopefully help anyone that ends up needing to accomplish the same thing.

    We needed to display a banner on certain pages in our environment that are not working properly in Internet Explorer so that we could inform users to switch to a different browser if they experienced issues. 

    So to accomplish this in FreeMarker (since we ran into other compatibility issues when attempting to use jQuery) with the method provided in the comment from xorrkaz above, I created some functions in a macro file (which can be downloaded here on GitHub) that allow us to quickly fingerprint the browser to find out the browser and operating system information.

    Here is an example of how we it can be used:

    <#-- Import dependencies -->
    <#import 'custom.macro.browser' as browserDetect />
    
    <#-- Get the browser information -->
    <#assign browserInfo = browserDetect.getBrowserInfo() />
    
    <#-- Display the browser and operating system info -->
    Browser (Base): ${browserInfo.base!"unknown"}<br />
    Browser (Specific): ${browserInfo.specific!"unknown"}<br />
    Operating System: ${browserInfo.os!"unknown"}


    The code sample above would return something like this:

    Browser (Base): Internet Explorer
    Browser (Specific): Internet Explorer 11
    Operating System: Windows 10


    We were then able to create our compatibility warning banner component and wrap it in an if statement like this:

    <#if browserInfo.base?? && (browserInfo.base == "Internet Explorer" || browserInfo.base == "Edge (Legacy)")>
      <#-- Display the banner -->
    </#if>


    I hope this helps anyone looking to accomplish something like this.  Enjoy!

  • Freemarker lets you grab HTTP headers, so you could do something with User-Agent:

     

    <#assign ua = http.request.getHeader("User-Agent") />

     

    • I know this is a super old thread, but I wanted to share some info that will hopefully help anyone that ends up needing to accomplish the same thing.

      We needed to display a banner on certain pages in our environment that are not working properly in Internet Explorer so that we could inform users to switch to a different browser if they experienced issues. 

      So to accomplish this in FreeMarker (since we ran into other compatibility issues when attempting to use jQuery) with the method provided in the comment from xorrkaz above, I created some functions in a macro file (which can be downloaded here on GitHub) that allow us to quickly fingerprint the browser to find out the browser and operating system information.

      Here is an example of how we it can be used:

      <#-- Import dependencies -->
      <#import 'custom.macro.browser' as browserDetect />
      
      <#-- Get the browser information -->
      <#assign browserInfo = browserDetect.getBrowserInfo() />
      
      <#-- Display the browser and operating system info -->
      Browser (Base): ${browserInfo.base!"unknown"}<br />
      Browser (Specific): ${browserInfo.specific!"unknown"}<br />
      Operating System: ${browserInfo.os!"unknown"}


      The code sample above would return something like this:

      Browser (Base): Internet Explorer
      Browser (Specific): Internet Explorer 11
      Operating System: Windows 10


      We were then able to create our compatibility warning banner component and wrap it in an if statement like this:

      <#if browserInfo.base?? && (browserInfo.base == "Internet Explorer" || browserInfo.base == "Edge (Legacy)")>
        <#-- Display the banner -->
      </#if>


      I hope this helps anyone looking to accomplish something like this.  Enjoy!