I have been writing a userscript for the past few months, for my company, and have just designed the main site for it with installation instructions (our employees are based all around the world and very few have heard of userscripts, let alone used them, so this frontend is meant to cut down the time I spend supporting the script).
What I would like to do is, on the installation page, detect which browser and OS / OS version they're using so that I can highlight the most relevant instructions slightly darker than the rest, or simply not display irrelevant sections.
For example for IE6 you must use Trixie (I believe) to install userscripts, and this is supported on Win XP only. IE7 is supported on Win XP, IE8 is supported on Win XP & Win 7 and IE9 is supported on Win 7 only. For IE7, 8 & 9 I am advising to use IEPro. The difference between Trixie & IEPro is that Trixie requires a file extension of .user.js which must be saved in C:/Program Files/bhelpuri. IEPro, on the other hand, requires the extension to be .ieuser and saves to a different location. For IE specifically, I would like to detect the version and display only the correct link (either .user.js or .ieuser, depending on what plugin they should be using for their current browser) so that they're taken to the correct version of the file for that browser with the correct save path for that OS / OS version. Is this making any sense so far?
Basically my question is, does anyone know of a way to detect the operating system version? I am currently using http://www.stoimen.com/blog/2009/07/04/jquery-os-detection/ but that doesn't give the OS version, only the OS. I have tried looping through all of the variables stored in the navigator object with no success. Any help would be greatly appreciated.
Edit: Thanks to Nates answer, I have put the exact code at http://jsfiddle.net/Mu8r5/1/. I hope this helps someone in the future.
Your best bet is to use the navigator.userAgent property. It will give the windows version number. You can see a table of how the Windows version number map to the OS here:
OSVERSIONINFO
Here is some example detection code:
var os = (function() {
var ua = navigator.userAgent.toLowerCase();
return {
isWin2K: /windows nt 5.0/.test(ua),
isXP: /windows nt 5.1/.test(ua),
isVista: /windows nt 6.0/.test(ua),
isWin7: /windows nt 6.1/.test(ua),
isWin8: /windows nt 6.2/.test(ua),
isWin81: /windows nt 6.3/.test(ua)
};
}());
if(os.isWin7) {
...
}
http://jsfiddle.net/45jEc/
You can use this great javascript library: http://www.visitorjs.com/details It is open-sourced recently
Edit: Actually, it is now renamed to session.js http://github.com/codejoust/session.js and to my knowledge, that is the best you can get.
The Stack Overflow question
Detect exact OS version from browser goes into some interesting detail about getting the OS version from the User-Agent header which I believe contains the same information that can be accessed from JavaScript.
Related
This question already has answers here:
How to detect Safari, Chrome, IE, Firefox and Opera browsers?
(30 answers)
Closed 6 years ago.
I know this is bad practice and feature recognition should be the way to go in terms of building the website. However that is not my use case.
I have different distributions of my browser extension and I would like to change the download button based on their current browser.
I've tried using navigator.userAgent, that has proven to be quite useless as most browsers have set all popular user agents. For example chrome has this.
navigator.userAgent = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.110 Safari/537.36"
I've seen many websites have this feature on their download buttons. How is this done properly?
EDIT: I've now learned the history of why "Mozzila/X.X" is at the start of the userAgent string. Apologies for the misunderstanding.
You can detect browsers in multiple ways.
For Chrome, apart from making a regex on the navigator.userAgent:
var isChrome = /Chrome/.test(navigator.userAgent);
You can also make a check on:
var isChrome = !!window.chrome && !!window.chrome.webstore;
I suggest you to see this answer for further details.
You should also consider using Modernizr.js for browser detection.
Just build a site and we're having issues with IE7 users. It had nothing to do with my programming, but a site we have to redirect the customers to that does not handle IE7. Problem is that the client base is not overly tech savvy and telling them to update their version of IE requires they understand what version of Windows they're using (XP or Vista) and also whether their version is 32-bit or 64-bit which I'm sure will really scare the users off.
The issue pretty much boils down to needing to find a way to detect what version of Windows they're using (XP or Vista ... Windows 7 won't run IE7) and then find a way to alert them as to whether they're using 32-bit or 64-bit and direct them accordingly.
Not sure if anyone else has come across this problem and curious how they've handled it.
As you want to find the useragent using javascript, use this
var user_agent = navigator.userAgent
The output to the above command on my machine is:
Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/535.7 (KHTML, like Gecko) Chrome/16.0.912.75 Safari/535.7
The UserAgent string in the http header can often be used to determine their OS, Browser, and their architecture (32 vs 64).
IE has a limit of 31 style sheets (there are ways around that) but is there a limit to how many javascript files i can include? if i go above it, what happens?
i've got a page now with 40+ included js files.
I tried it myself and can now say that you can safely import and execute at least 200 JavaScript files in your HTML via script tag with the src-attribue with the following browsers:
Win XP IE6,
Win XP IE7,
Win XP IE8,
Windows 7 IE9,
Mac OS X Lion Chrome 21,
Mac OS X Lion Firefox 15,
Mac OS X Lion Opera 12,
Mac OS X Lion Safari 6.
Due respect, I think you're asking the wrong question. The correct question is: "I have 40+ JS include files...how do I fix it?"
Check out Google's article on reducing http round-trips, and the benefits of doing so. Combine, minify and deliver your files via gzip whenever possible.
The page not working is one concern, and a valid one...but why not side-step it and greatly improve your users' load time while you're at it by combining and minifying those files now, before you approach any limit? For mobile users round-trips are especially painful, but there's no reason not to offer a more optimal load experience to all your users.
I was working with some javascript and found a strange user agent with my Google Chrome.
I have Google Chrome 7.0.517.41 beta installed on my Ubuntu Laptop.
Now AFAIK my user agent should be something close to Chrome/7.0.517.41
but it is showing me:
Mozilla/5.0 (X11; U; Linux i686; en-US) AppleWebKit/534.7 (KHTML, like Gecko) Chrome/7.0.517.41 Safari/534.7
Why is this happening.. I have disabled all the installed extensions but it is still the same..
The UA string tells the long and tragic history of (in)compatibility attempts. See e.g. this for a brief history of the UA. It should also make clear that UA sniffing is useless, as every modern browser pretends to be many other browsers. That is also the case you see here:
Mozilla - the most ancient artefact, dating from the early 1990s
X11 - the graphical interface used
Linux i686 - OS and processor type
en_US - your locale (English, United States)
AppleWebKit/534.7 - the actual rendering engine
(KHTML, like Gecko) - another artifact of browser sniffing: "Gecko" is the FF rendering engine, KHTML is an old rendering engine, predecessor of WebKit (was used by Konqueror browser, then forked by Apple to form WebKit)
Chrome/7.0.517.41 - the actual browser version
Safari/537 - yet another artifact against scripts sniffing for "Safari" (which uses the same engine)
In short: some broken sites assumed that "only allowing people with Mozilla/Firefox/Webkit/whatever" is a sensible policy; in turn, browsers started lying about their origins to get around these artificial barriers. The UA strings are the result: bloatware, full of useless garbage.
Basically, Mozilla stands for "Mozilla compatible" while "KHTML, like Gecko" describes the rendering engine.
Essentially, Chrome's user agent string is saying "I'm compatible with Mozilla and my rendering engine is like Gecko" as a way of describing itself to developers.
Most (if not every) browser will identify itself as Mozilla-compatible as a kind of legacy thing, regardless of affiliation with the Mozilla foundation. Yes, even Internet Explorer.
More info on strings in general at: Mozilla's developer center.
Also, if you're developing based on user agent strings, don't. You'll only find yourself in a world of hurt: browsers get upgraded to implement features and your user agent sniff might still exclude them, user agent strings can be spoofed, and good old Opera likes to report itself as Internet Explorer in older versions.
Instead, use feature detection to determine if a feature you're trying to use exists for a given browser and then use it or don't.
There are historical reasons for browsers "lying" about themselfs. The main reason for this was user agent sniffing. Opera is the only browser which identifies itself as Opera, all other browsers use Mozilla/5.0 or the older ones Mozilla/4.0.
The only thing you should know about this is: User agent strings cannot be trusted, feautre detection is recommended instead.
User agent strings are like that, as mentioned.
You haven't said that explictly, but if you are planning to use useragent string to detect the user's browser, please use some good code to do that (i.e. don't code it yourself in a hurry, you'll not get it right).
Here is a nice one that I've used a couple times before: Browser detect.
After trying everything I have finally used : http://www.useragentstring.com/
You can use the above website to get the formatted user agent and OS.
They have api which you can use directly...
hope it helps..!!!
Simple question... How am I going to reproduce Javascript bugs if I don't have a Mac & Safari?
Is it possible to run a legit copy of Mac OS on VMWare, or even better...run Safari in Windows?
Apple had a windows download for safari, but it's long-gone.
This is long out-of-date. Can't delete this accepted answer. :-(
or even better...run Safari in Windows?
Sure: http://www.apple.com/safari/
I expect that any JS bug will be repeatable in the Windows version of Safari as well. However, for completeness, there are several services that allow you to view your web page in a metric boatload of browsers on OS X, Linux, and Windows, e.g. litmusapp.com. In this case, your question suggests that you may need more than a screenshot -- browsrcamp.com has a service which allows you to remote into a Mac and use a web browser interactively.
(Grain of salt: I haven't used any of these services myself.)
This is an extremely odd question. Javascript can have bugs on any platform. Why not download Safari for Windows, or use Firefox combined with Firebug?