| MACROMEDIA FLASH |
| DETECTING FLASH 2+ IN A BROWSER |
Basic Flash 2+ Detection
Want a copy of the script? Right-click (or click & hold on Mac) and choose "Save link as..." to download:
detect.html (the script page)
flashcontent.html (the Flash page)
nonflash.html (the installation/alternate content page)
unabletodetectflash.html (the failed javascript page)
Description:
This script is intended for Flash developers who want excellent basic control over detecting Flash without investing too much time in learning JavaScript, and without hand producing highly customized detection scripts. The script is simple, reliable, and addresses all browsers.
The script checks for Flash 2 or better capabilities in a browser. If it finds Flash 2 (or higher) it sends the user to a Flash content page. If it doesn't, it sends the user to a non-Flash page. And if it can't determine whether or not the browser supports Flash, it sends the user to a manual choice page.
This script is best used as a front door to Flash 2 content (ie. content that was originally authored for the Flash 2 plug-in) because it allows users of both the Flash 2 plug-in and the Flash 3 plug-in to proceed to the Flash content.
Issues:
When using this (or any) script to check the availability of Flash, it's important to remember that detection routines can never be perfect. Not all browsers enable the Flash component in the same way (eg. ActiveX vs Plug-in), and not all browsers support the detection of that component (eg. MSIE 3.0 and Netscape 2.0 don't support the navigator.plugins JavaScript property). In fact, not all browsers will even have JavaScript turned on. Because of those limitations, detection scripts are always forced to make choices about how to guide the user to the appropriate location.
Bearing that in mind, our script's goal is to maintain a controlled experience for the broadest possible range of users. (We'd rather give users custom explanations of what's going on than let them see a puzzle piece and try to figure it out...). As is, the script is ready for the ol' cut'n'paste, but it's probably worth examining the step-by-step implementation below so you can customize the behaviour to suit your users.
How To:
Here's a break down of how it works.
|
|||||||||||||
| Overview | Classifying Browsers Our script will identify three different kinds of browsers: 1) Those that definitely have Flash 2+ installed, or that support the automatic installation of Flash, 2) Those that definitely do not have Flash 2+ installed, and 3) Those that do not support Flash detection. Once the kind of browser is determined, the script redirects the user's browser to the page that matches their case. Note that many detection scripts in common use neglect the third category of browser (those that do not support Flash detection), leaving some users without a proper description of what's going on, or worse, telling users that they do not have Flash installed when in fact they do, or that they need to install Flash when their browser doesn't support it. The goal of this script is to prevent that from happening--whatever the browser, the user should always find themselves on one of our four pages: 1) detection in progress, 2) Flash, 3) non-Flash, or 4) unable to detect Flash. The following diagram outlines the logical steps our script takes to categorize the browser and redirect it to the corresponding web page. A description of each step follows.
|
||||||||||||
| 1) | Check For JavaScript
First things first. If the browser doesn't support JavaScript, we're not going to be able to detect anything. So checking for JavaScript is our first decision point. We actually don't perform a real "check" for JavaScript--we just try to use it, hiding the code from older browsers using HTML comment tags (<!--comment-->). If our JavaScript works, then we proceed to (2b)--Does the browser support auto-install. If it doesn't work, we proceed to (2a)--Does the browser support META refresh. |
||||||||||||
| 2a) | Does the browser support META refresh?
If JavaScript is turned off (yes, people do turn it off, especially when it's often used to do annoying things like spawning advertising windows) or if JavaScript is not supported by the browser, we can still try to guide the user to a page that explains what they're missing, and how to access it. We try to guide them there using META refresh, a long standing HTML technique that allows basic client-side page redirection. As with our check for JavaScript, we don't really "check" to see if the browser supports META refresh, we just try to do it. Using If the META tag is successful, our script's work is done, and the user sees "unabletodetectflash.html", a page that explains what Flash is and offers manual links to the Flash or non-Flash content. If, on the other hand, the META refresh does not work, the user will be left on the detection script page (and again, our script's work is done). It's important to realize that this will happen for some people: if JavaScript isn't enabled, and META doesn't work, the user's not going anywhere. So we must be sure to give adequate information about what's happening even on the detection page. I normally state something very simple, like "Please wait...scanning for Macromedia Flash. You may also proceed manually to the Flash content or the non-Flash content.". If you use anything more wordy, users who see this page briefly while detection occurs may feel like they are missing something. |
||||||||||||
| 2b) | Does the browser support auto-install?
If we're at this stage, we know JavaScript is active. We're now going use that JavaScript to ask the browser a series of questions about itself. The first question we ask it is "Are you Microsoft Internet Explorer?". We ask this first because most versions of MSIE perform an autoinstall of Flash. We want to identify those browsers quickly and send them on to the Flash content (if the browser already has Flash, they'll start seeing content; if not, they'll start downloading the Flash ActiveX control automatically [see note on MSIE Authenticode, below]). The two cases where MSIE won't perform autoinstall are 1) when it's running on Windows 3.1, and 2) when it's running on Macintosh. So we first ask the browser "Are you MSIE, and if so, are you running on Windows 3.1 or Macintosh?". If it answers "Yes", then we set a flag saying we've got MSIE, but no autoinstall capabilities. (As a matter of code style, I set a flag so I can see what's going on in the code more easily. Also, if new platforms need to be added, they can be happily dropped into the flag-setting conditional. However, you could do the check without setting a flag if preferred.). Here's the code:
noautoinstall = ""
if(navigator.appName == "Microsoft Internet Explorer" &&
(navigator.appVersion.indexOf("Mac") != -1 ||
navigator.appVersion.indexOf("3.1") != -1)){
noautoinstall = "true";
}
If the browser is MSIE, and it's not running on Windows 3.1 or Macintosh, we send it to the Flash content, and our script's work is done:
if (navigator.appName == "Microsoft Internet Explorer" &&
noautoinstall != "true"){
window.location=flashpage;
}
Otherwise, we move on to the next check: 3) Does the browser support the navigator.plugins array? |
||||||||||||
| 3) | Does the browser support the navigator.plugins array?
At this stage, we know that most MSIE browsers (all but Mac and Win 3.1) have already been dealt with. So now we're mostly interested in Netscape. Our script checks navigator.plugins to look for Flash 2 or Flash 3 by name. I previously had used a MIME type check here, but abandoned that after discovering that Navigator 4.5 seems to report the Flash MIME type as set even when Flash is not installed. Unfortunately, because the entries for Flash 2 and 3 differ in the navigator.plugins array, we're now forced to check for each explicitly. When Flash 4 or any future Flash plugin is released, we'll have to add them to our check here. We check first to see if the browser's JavaScript supports the navigator.plugins property using if(navigator.plugins). By checking this information separately from our explicit check for the Flash plugins, we allow for the possible existence of Flash in browsers that may not support the JavaScript we need to detect Flash. Netscape 2.0 is one such browser, and MSIE 4.0 on Mac is another. Though the JavaScript in those browsers doesn't include the plugins property of navigator, they can run Flash 3. (Some scripts assume that if the plugins property isn't set, Flash isn't installed, so they end up sending users that have Flash to non-flash pages). At this stage we've already sent IE browsers that support autoinstall to the Flash content, so if the browser we're now working with does support JavaScript, but doesn't support plugin detection via navigator.plugins, we send it to the "unable to detect Flash" page, and our script's work is done. If, on the other hand, the browser does allow for plugin detection, we can check to see if Flash is installed at 4) Is Flash 2 or 3 plugin present? |
||||||||||||
| 4) | Is Flash 2 or 3 plugin present?
The last stage of our script is simple. We know the browser supports plugin detection, so all we have to do is ask it if the Flash plugin exists, using: if(navigator.plugins["Shockwave Flash"]) or if(navigator.plugins["Shockwave Flash 2.0"]). If the plugin exists, we send the user on to the Flash page, and the script is done. If not, our script is also done: we send them to the non-Flash page, knowing for sure that their browser does not have Flash installed. There's only one small concern left: if the browser is running on Unix, the user can't install Flash, even if they wanted to. We should remember to include that information on our non-Flash page. |
||||||||||||
| The Pages | Who goes where, and what should they see?
Now that our script has accounted for all browsers, let's examine which browsers will end up on which page, and how we explain to the user why they're there.
|
