Why this code doesn't alert the browser type?

Question

Can you tell me what I am missing in writing this code?

<button onclick="getBrowserName()">You Browser Name?</button>
<script>
    function getBrowserName()
{

    //Uses external interface to reach out to browser and grab browser useragent info.
    var browserAgent:String = ExternalInterface.call("function getBrowser(){return navigator.userAgent;}");
    //Determines brand of browser using a find index. If not found indexOf returns (-1).
    if(browserAgent != null && browserAgent.indexOf("Firefox")>= 0) 
    {
        alert("Firefox");
    }
    else if(browserAgent != null && browserAgent.indexOf("Safari")>= 0)
    {
        alert("Safari");
    }
    else if(browserAgent != null && browserAgent.indexOf("MSIE")>= 0)
    {
        alert("IE");
    }
    else if(browserAgent != null && browserAgent.indexOf("Opera")>= 0)
    {
        alert("Opera");
    }
    else 
    {
        alert("Undefined");
    }
    return 0;
}

</script>

I hope there's a good reason for browser detection. Its best to use feature detection whenever you can. — cgatian, Jun 25 '14 at 02:06
@cgatian I have a good reason for doing so however the code is not working! — Mona Jalal, Jun 25 '14 at 02:07
Why do you need this `var browserAgent:String = ExternalInterface.call("function getBrowser(){return navigator.userAgent;}");` ? Just do `window.navigator.userAgent` — karthikr, Jun 25 '14 at 02:12
Just because a browser doesn't have one of the expected strings in its user agent string, you call it undefined. More accurate might be "Not a browser I care about" perhaps? ;-) There is a list of over 80 browsers [*here*](http://www.webdevelopersnotes.com/design/browsers_list.php3), and a database of thousands of UA strings [*here*](http://www.user-agents.org/). — RobG, Jun 25 '14 at 02:32

AstroCB · Answer 1 · 2014-06-25T02:30:23.797

2

Well, there are a few things wrong here.

var browserAgent: String: it appears that you're using actionscript syntax, but JS uses dynamic typing, so var is all you need. There's no need to explicitly define the variable's data type, and if you try to do it this way in JS, it's going to give you syntax errors.
ExternalInterface.call: this is another carryover from ActionScript: you don't need this. In fact, it won't work at all because there's no ExternalInterface class in standard JS.
Your getBrowser() function is unnecessary. You're setting browserAgent equal to the result of calling a function from an ExternalInterface, but you can do this directly: var browserAgent = window.navigator.userAgent.

When I fixed those things, it worked fine.

Next time, I would recommend checking the browser console, because, if nothing is happening, the errors that appear there will help you solve your issue nine times out of ten.

Demo

edited Jun 25 '14 at 02:30

answered Jun 25 '14 at 02:15

AstroCB

12,337
20
57
73

1

Your first point is wrong. When/where the function is declared is totally irrelevant, as long as it exists in the global scope at the time the button is pressed. – Bergi Jun 25 '14 at 02:17
Even a `var` in that place would've created a global variable. – Bergi Jun 25 '14 at 02:32
@Bergi Never mind; I was thinking of its scope only [within the JS](http://stackoverflow.com/questions/336859/var-functionname-function-vs-function-functionname). – AstroCB Jun 25 '14 at 02:37

score 2 · Answer 2 · edited Apr 19 '15 at 02:16

If you replace this line

var browserAgent:String = ExternalInterface.call("function getBrowser(){return navigator.userAgent;}");

with this line:

var browserAgent = window.navigator.userAgent;

Then your script works fine on my side.

However, the criteria you use to test the engine are not precise. Have a look at this: http://www.useragentstring.com/pages/useragentstring.php

There are many browsers that will tell you Firefox even if they another brand. But they are based on each other or they use a specific engine that is built in other browsers too.

If I use your script with a Chrome browser, it says "Safari" instead of "undefined".

About the punctuation: I know of only two places in Javascript where to use the double point:

the conditional operator a = b ? c : d;
the attribute - value assignment in object notation: { name : value }

Your code line containing :String = ExternalInterface... reminds me rather on ActionScript (?).

score 0 · Accepted Answer · answered Jun 25 '14 at 02:12

0

Im not quite sure what the follow code should be doing. Are you sure its correct?

    var browserAgent:String = 
ExternalInterface.call("function getBrowser(){return navigator.userAgent;}");

I would expect this code to simply look like this:

var browserAgent = navigator.userAgent;

Below is a example with this change. http://jsbin.com/lukasere/1/edit

answered Jun 25 '14 at 02:12

cgatian

22,047
9
56
76

1

You're welcome. Be careful with browser detection! It's so unreliable! – cgatian Jun 25 '14 at 02:18
I need it for playing various audio type depending on the browser type as asked in my previous SO post here http://stackoverflow.com/questions/24398911/how-to-detect-browser-type-in-html5-or-javascript-for-playing-mp3-instead-of-web – Mona Jalal Jun 25 '14 at 02:21
I just realized this code is not reliable as is telling Chrome in Ubuntu is Safari!!! – Mona Jalal Jun 25 '14 at 02:31
1

@MonaJalal That's the problem with browser detection. – AstroCB Jun 25 '14 at 02:32
How come hasn't been yet fixed? #weird – Mona Jalal Jun 25 '14 at 02:36
1

@MonaJalal Well, see the debate [here](http://stackoverflow.com/questions/1294586/browser-detection-versus-feature-detection): it's not a problem with "fixing" something, per se, but really about best practice and [future-proofing your code](http://ejohn.org/blog/future-proofing-javascript-libraries/). – AstroCB Jun 25 '14 at 02:41

Why this code doesn't alert the browser type?

3 Answers3