For the same browser getting different version info with different URL in Javascript

Question

Hi I have a requirement to detect the browser version via JavaScript. From here i am able to get what i expected. However, the version that returned is different when i access the page via localhost and via hostname.

Create a simple HTML page (BrowserVersion.html) with below source.

<html>
<script>

var BrowserDetect = {
    init: function () {
    this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
    this.version = this.searchVersion(navigator.userAgent)
    || this.searchVersion(navigator.appVersion)
    || "an unknown version";
    this.OS = this.searchString(this.dataOS) || "an unknown OS";
    },
    searchString: function (data) {
    for (var i=0;i<data.length;i++) {
    var dataString = data[i].string;
    var dataProp = data[i].prop;
    this.versionSearchString = data[i].versionSearch || data[i].identity;
    if (dataString) {
    if (dataString.indexOf(data[i].subString) != -1)
    return data[i].identity;
    }
    else if (dataProp)
    return data[i].identity;
    }
    },
    searchVersion: function (dataString) {
    var index = dataString.indexOf(this.versionSearchString);
    if (index == -1) return;
    return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
    },
    dataBrowser: [
    {
    string: navigator.userAgent,
    subString: "Chrome",
    identity: "Chrome"
    },
    { string: navigator.userAgent,
    subString: "OmniWeb",
    versionSearch: "OmniWeb/",
    identity: "OmniWeb"
    },
    {
    string: navigator.vendor,
    subString: "Apple",
    identity: "Safari",
    versionSearch: "Version"
    },
    {
    prop: window.opera,
    identity: "Opera"
    },
    {
    string: navigator.vendor,
    subString: "iCab",
    identity: "iCab"
    },
    {
    string: navigator.vendor,
    subString: "KDE",
    identity: "Konqueror"
    },
    {
    string: navigator.userAgent,
    subString: "Firefox",
    identity: "Firefox"
    },
    {
    string: navigator.vendor,
    subString: "Camino",
    identity: "Camino"
    },
    { // for newer Netscapes (6+)
    string: navigator.userAgent,
    subString: "Netscape",
    identity: "Netscape"
    },
    {
    string: navigator.userAgent,
    subString: "MSIE",
    identity: "Explorer",
    versionSearch: "MSIE"
    },
    {
    string: navigator.userAgent,
    subString: "Gecko",
    identity: "Mozilla",
    versionSearch: "rv"
    },
    { // for older Netscapes (4-)
    string: navigator.userAgent,
    subString: "Mozilla",
    identity: "Netscape",
    versionSearch: "Mozilla"
    }
    ],
    dataOS : [
    {
    string: navigator.platform,
    subString: "Win",
    identity: "Windows"
    },
    {
    string: navigator.platform,
    subString: "Mac",
    identity: "Mac"
    },
    {
    string: navigator.userAgent,
    subString: "iPhone",
    identity: "iPhone/iPod"
    },
    {
    string: navigator.platform,
    subString: "Linux",
    identity: "Linux"
    }
    ]
    };
    BrowserDetect.init();
    </script>
<script type="text/javascript">
    navigator.sayswho= (function(){
  var N= navigator.appName, ua= navigator.userAgent, tem;
  var M= ua.match(/(opera|chrome|safari|firefox|msie)\/?\s*(\.?\d+(\.\d+)*)/i);
  if(M && (tem= ua.match(/version\/([\.\d]+)/i))!= null) M[2]= tem[1];
  M= M? [M[1], M[2]]: [N, navigator.appVersion,'-?'];
  return M;
 })();
 alert(navigator.sayswho);
 </script>

<html>

Now when I access above page with below URL I am getting the value as, MSIE,8.0

http://localhost:8080/docs/BrowserVersion.html,

But when I access the same page with below URL I am getting the value as MSIE,7.0.

http://mylocalhost:8080/docs/BrowserVersion.html

Why the browser version is changing between two version of URLs.

Note: My host file has below entries

127.0.0.1   localhost
127.0.0.1   mylocalhost

Any thoughts?

John · Accepted Answer · 2013-09-17T06:00:36.197

You'll have to disable IE's compatibility view for local domains.

Go to IE's compatibility view setting and uncheck the second option "Display intranet sites in Compatibility View".

The VERY basics of DOM object detection for browsers/browser versions...

var z = document.getElementsByTagName('body')[0];

if (z.style.MozBinding!=undefined)
{
 browser='Firefox';
}
else if (window.opera)
{
//Opera up to 12.5
}
else if (z.style.scrollbar3dLightColor!=undefined)
{
 browser='msie';
}
else if (z.style.khtmlMarginBottomCollapse!=undefined && z.style.WebkitBorderRadius==undefined) {browser='Safari'; browser_version='2.0';}
else if (z.style.WebkitBorderRadius!=undefined || z.style.khtmlMarginBottomCollapse!=undefined)
{
 if (z.style.item=='function item() { [native code] }')
 {
  browser='Chrome';
 }
 else
 {
  browser='Safari';
 }
}
else if (z.style.KhtmlBorderRadius!=undefined) {browser='Konqueror';

...and keep in mind that User-Agent string detection is evil and the code above will fail in IE11, whose `User-Agent` header does not contain `MSIE`. — EricLaw, Sep 16 '13 at 19:13
@EricLaw Very true! Updated my answer to include basic DOM based browser detection. — John, Sep 17 '13 at 06:01

For the same browser getting different version info with different URL in Javascript

1 Answers1