Using the Right Markup to Invoke Plugins

This article is about how to invoke a plugin with the correct use of HTML. It discusses the object element and the embed element, with details about using the most apt HTML to invoke Java in a web page as well.

The Object Element: W3C Standards and Cross-Browser Issues

The object element is part of the HTML 4.01 specification, and is the recommended mechanism to invoke plugins. Its use is subject to a few caveats that this section outlines.

Traditionally, the object element has been used differently by Microsoft Internet Explorer and by Mozilla-based browsers such as Netscape 7. In IE, the object element is used to invoke a plugin that is built on the ActiveX architecture. Here's an example of this kind of usage for IE: 

<!-- IE ONLY CODE -->
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" 
width="366" height="142" id="myFlash">
    <param name="movie" value="javascript-to-flash.swf" />
    <param name="quality" value="high" />
    <param name="swliveconnect" value="true" />
</object>

In the above example, the classid attribute that goes along with the object element points to a "clsid:" URN followed by the Unique Identifier of an ActiveX control (in the above example, the string beginning with "D27..."). This is, in fact, the Unique Identifier of Macromedia's Flash plugin, and developers are expected to know such Unique Identifiers in order to invoke the component of their choice. The codebase attribute used above points to a location that houses the CAB file containing the ActiveX control. In this context, the codebase attribute is used as an obtainment mechanism -- that is to say, a way to obtain a control if it isn't present. If the Flash ActiveX control is not installed, IE will then go to the URL referenced by the codebase attribute and retrieve the ActiveX control. Additional param elements (which are "children" of the above object element) specify configuration parameters for the Flash plugin. For instance, the param name="movie" tells the Flash plugin the location of the SWF file to start playing.

With the release of Netscape 7.1, this kind of ActiveX use of the object element is supported for use with the Microsoft® Windows Media Player. Only the Windows Media Player is supported as an ActiveX control in Netscape 7.1. The details are covered in another article.

Browsers such as Netscape 7 will not render the Flash plugin if the above kind of markup is used, because Netscape 7 does not support ActiveX or ActiveX-based component invocations, with the exception of Windows Media Player in Netscape 7.1. Mozilla-based browsers support the Netscape Plugin architecture, which is not COM based like ActiveX (and thus, not invoked via a Unique Identifier) but rather, MIME type based. Mozilla-based browsers support the use of the object element along with a MIME type. Here is an example of this usage, once again for the Macromedia Flash plugin: 

<object type="application/x-shockwave-flash" data="javascript-to-flash.swf" 
width="366" height="142" id="myFlash">
    <param name="movie" value="javascript-to-flash.swf" />
    <param name="quality" value="high" />
    <param name="swliveconnect" value="true" />
    <p>You need Flash -- get the latest version from 
    <a href= "http://www.macromedia.com/downloads/">here.</a></p>
</object>

In the above example, application/x-shockwave-flash is the Flash MIME type, and will invoke the Netscape-specific Flash architecture in Mozilla-based browsers. The data attribute points to the SWF file to play, and the configuration parameters (the param elements) are used in a consistent manner both for IE and for Mozilla-based browsers such as Netscape 7. In fact, the above usage will also work for IE, which understands MIME type invocations for certain MIME types such as Flash in addition to ActiveX-style classid invocations.

Since the use of MIME type for Flash will work for both IE and Netscape 7, you can use the above markup to invoke the Flash plugin for both IE and Netscape 7. However, there are a few caveats that developers ought to bear in mind when using the object element with Mozilla-based browsers such as Netscape 7 and in IE:

Caveats

  • If you use one single object element for both browsers (as in the above example), it is not possible to provide a cross-browser obtainment mechanism for streamlined download. You cannot use a codebase attribute to link to a signed CAB file for the ActiveX component, since this won't work in Mozilla-based browsers such as Netscape 7. Furthermore, IE's use of the codebase attribute as an obtainment mechanism itself is not strictly correct according to the HTML 4.01 specification, which says that the codebase attribute should be used to qualify URNs referenced by the data, archive, and classid attributes. Future Netscape browsers based on Mozilla source code will allow the use of a special param element to specify where to get plugins that are not present, but this feature is not available in Netscape 7. This feature is discussed in Mozilla bug 167601.
  • IE doesn't display nested object elements correctly according to the HTML 4.01 specification. According to the specification, you can nest elements and browsers should stop if they can display the outermost element, or else keep going inwards till they can find something to display. IE displays everything as if they are in series, and not nested. Thus, in the following example, instead of stopping at the ActiveX control, IE will display the same animation twice since it also understands the MIME type for Flash: 
<!-- Usage Will Not Work As Intended -->
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" 
width="366" height="142" id="myFlash">
    <param name="movie" value="javascript-to-flash.swf" />
    <param name="quality" value="high" />
    <param name="swliveconnect" value="true" />
	<object type="application/x-shockwave-flash" data="javascript-to-flash.swf"
	 width="366" height="142" id="myFlashNSCP">
		<param name="movie" value="javascript-to-flash.swf" />
    		<param name="quality" value="high" />
    		<param name="swliveconnect" value="true" />
		<p>You need Flash -- get the latest version from
		 <a href="http://www.macromedia.com/downloads/">
		here.</a></p>
	</object>
</object>
  • Web authors have to specify an obtainment mechanism in Mozilla-based browsers -- the browser won't automatically retrieve plugins that are missing if you don't specify where to get the plugin from using the codebase attribute. If you don't specify a codebase attribute, and the plugin is not installed,the browser will display only the alternate innermost text. It won't attempt to retrieve a missing plugin using the Netscape Plugin Finder service. This behavior is not incorrect according to the HTML 4.01 specification, but it obliges web authors to diligently specify obtainment mechanisms. At a minimum, web authors will have to nest some alternate text inside their object elements telling users where to obtain the missing component. Adding an additional layer of convenience in the form of automatic retrieval is the subject of a bug discussion in the Mozilla open source code.
  • Some plugins don't understand all the param elements that their documentation suggests should configure them in Mozilla-based browsers. An example is versions of the Macromedia Flash player plugin upto Flash Player 6 r. 47, which don't understand the <param name="movie" value="animation.swf"> param element, which is supposed to tell the Flash player which animation to start playing. In order to work around this, developers are encouraged to use the data attribute to the object element: <object type="application/x-shockwave-flash" data="animation.swf"..../>. The fact that the Flash player doesn't understand this param is a Macromedia Flash Player bug that is discussed in the bug database.

Recommendation

In order to overcome the shortcomings that you can't nest object elements in IE and that there isn't a way you can simply use one object element in a cross-browser way (with architecture specific obtainment mechanisms), the best course of action is to dynamically write object elements based on architecture. For example, on browsers that support ActiveX, such as IE, create an object element with a classid attribute, and on browsers that support the Netscape Plugin architecture, use a MIME type. Here is an example of some JavaScript which does this: 

if (window.ActiveXObject)
{
// browser supports ActiveX
// Create object element with 
// download URL for IE OCX
document.write('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"');
document.write(' codebase="http://download.macromedia.com');
document.write('/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"');
document.write(' width="366" height="142" id="myFlash">');
document.write(' <param name="movie" value="javascript-to-flash.swf" />');
document.write(' <param name="quality" value="high" />');
document.write(' <param name="swliveconnect" value="true" />');
document.write('<\/object>');
}
else
{
// browser supports Netscape Plugin API
document.write('<object id="myFlash" data="javascript-to-flash.swf"');
document.write(' type="application/x-shockwave-flash"');
document.write(' width="366" height="142">');
document.write('<param name="movie" value="javascript-to-flash.swf" />');
document.write('<param name="quality" value="high" />');
document.write('<param name="swliveconnect" value="true" />');
document.write('<p>You need Flash for this.');  
document.write(' Get the latest version from');
document.write(' <a href="http://www.macromedia.com/downloads">here<\/a>.');
document.write('<\/p>');
document.write('<\/object>'); 
}

See also: Flash Satay

The Object Element and Java

Mozilla-based browsers such as Netscape 6.x, Netscape 7, and CompuServe 7 ship with the Java plugin that Sun provides. Users installing Netscape 6.x and Netscape 7 have a choice of whether or not to install Java. Unlike Netscape Communicator 4.x, Netscape 6.x and 7 do not have a default Java Virtual Machine -- they rely on Sun's plugin. During the Netscape Communicator 4.x days, Netscape Communications used to develop a Java Virtual Machine which supported Java 1.5.0 and below. Now, with Netscape 6 and 7, the Java Virtual Machine is Sun's plugin. Netscape no longer develops or ships a default Netscape Java Virtual Machine with the browser.

Sun's Java plugin can be invoked by the object element, just like any other plugin. Once again, IE typically invokes the plugin by way of an object element used in conjunction with a classid attribute that points to an ActiveX Unique Identifier. Each major version of the plugin has a Unique Identifier. For instance, this is an example of the type of markup that will invoke the JRE 1.4.1 in IE, using the unique identifier for the JRE 1.4.1: 

<!-- IE ONLY CODE -->
<object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93"
     width="460" height="160"
codebase="http://java.sun.com/products/plugin/autodl/jinstall-1_4_1-windows-i586.cab#version=1,4,1">
     <param...>
     <param...>
</object>

The above invocation won't work for Mozilla-based browsers such as Netscape 7 because of the same reason mentioned above: classid used in conjunction with a Unique Identifier references an architecture (ActiveX) that Mozilla code (and thus Netscape 7) does not support. You can invoke the Java plugin for Netscape 7 and other Mozilla-based browsers by using the appropriate Java MIME type. Here is an example: 

<object type="application/x-java-applet;jpi-version=1.4.1_01"
width="460" height="160">
	<param name="code" value="Animator.class" />
	<param name="imagesource" value="images/Beans" />
	<param name="backgroundcolor" value="0xc0c0c0" />
	<param name="endimage" value="10" />
	<param name="soundsource" value="audio">
	<param name="soundtrack" value="spacemusic.au" />
	<param name="sounds" value="1.au|2.au|3.au|4.au|5.au|6.au|7.au|8.au|9.au|0.au" />
	<param name="pause" value="200" />
	<p>You need the Java Plugin.
         Get it from <a href="http://java.sun.com/products/plugin/index.html">here.</a></p>
</object>

The above code mentions a version specific MIME type, and if the Mozilla-based browser such as Netscape 7 doesn't have JRE 1.4.1_01 installed, the alternate text is displayed. It isn't always necessary to give such a version specific MIME type. If you aren't taking advantage of any version specific features, a more generic MIME type such as application/x-java-vm will do the job just as well. The configuration parameters for the applet, including the class which contains the initial entry point (Animator.class, referenced by the "code" param element), are specified in multiple param elements.

Mozilla-based browsers such as Netscape 7 also allow for a special classid attribute that can also be used. This is the special "java:" classid. Here is an example using this invocation method: 

<object classid="java:NervousText.class" width="534" height="50">
	<param name="text" value="Java 2 SDK, Standard Edition v1.4" />
	<p>You need the Java Plugin.
	   Get it from
	   <a href="http://java.sun.com/products/plugin/index.html">here.
	   </a>
	</p>
</object>

The "java:" classid allows you to reference the class that provides the primary entry point. The rest of the configuration parameters work via the param elements.

Applet -- The Popular Choice

The applet element is still very much supported, and is the most popular way currently to invoke Java applets. In Netscape 7 and CompuServe 7, the applet element directly invokes the Java plugin. Here is a sample: 

<applet code="NervousText.class" width="534" height="50">
	<param name="text" value="Java(TM) 2 SDK, Standard Edition v1.4" />
</applet>

The applet element has been deprecated in the HTML 4.01 specification, but an advantage to using it is that in Mozilla-based browsers such as Netscape 7, if you are missing Java, an automatic obtainment mechanism is in place. The browser will use Netscape's Plugin Finder Service to download the missing Java plugin. The References section gathers resources about the use of the applet element.

The Embed Element

The embed element has been used to invoke plugins since the early days of Netscape browsers. Typically, the embed element is nested within an object element, such that the outer object element invokes an ActiveX control for IE, whereas the inner embed element invokes a Netscape Plugin. Here is an example of this usage: 

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"
width=366 height=142 id="myFlash">
	<param name="movie" value="javascript_to_flash.swf" />
	<param name="quality" value="high" />
	<param name="swliveconnect" value="true" />
		<embed src="javascript_to_flash.swf" quality="high" width="366" height="142"
    		type="application/x-shockwave-flash"
    		pluginspage="http://www.macromedia.com/downloads/"
    		name="myFlash" swliveconnect="true">
    		</embed> 
</object>

Links to the rules governing the use of the embed element can be found in the References section. The embed element is currently the most widely used element to invoke plugins in Netscape browsers. It is important to note, however, that the embed element is not part of the HTML 4.01 Specification, and is therefore not a W3C standard. Some caveats governing the use of the embed element are:

  • Do not include a name attribute with the object element, especially if it is the same name value as that of the embed element. Though doing so actually violates the HTML 4.01 standard, some code generators give name attributes to the object element. Mozilla-based browsers will not allow you to access the named embed element via JavaScript DOM 0 methods if the object element has the same name. Use the id attribute with the object element. The id attribute of the object element can be the same value as the name attribute of the embed element.
  • You'll notice that the embed element allows configuration parameters passed to the plugin via custom attributes, such as swliveconnect="true". These are analogous to the param elements used by the object element. Different plugin vendors may require different configuration paramaters to be passed via the embed element, and learning these is advisable.

Note that the obtainment mechanism for the embed element -- that is, the way in which a plugin is obtained if it is missing -- comes via the pluginspage attribute. This attribute points to a page to get the plugin if it is not detected by the browser. The pluginurl attribute is another attribute that can be used, and it can be used to point directly to an XPInstall file for a more streamlined download. For the embed element in particular, these attributes in Netscape 7 and Mozilla are governed by the Plugin Finder Service preference. Under Edit | Preferences | Navigator | Helper Applications is a preference to use Netscape's Plugin Finder Service. If the user has checked Always Use the Netscape Plugin Finder Service to get Plugins then whether these attributes are specified or not makes no difference -- the browser will always consult with the Plugin Finder Service to determine if it has a plugin to handle the missing MIME type. If the preference is unchecked, the Plugin Finder Service will be consulted only if the web page author does NOT specify either of these attributes.

Original Document Information

References

General -- Specifications
Object Element
Embed Element
Java
Bugs and Future Directions In Netscape and Mozilla

Document Tags and Contributors

Tags: 
 Contributors to this page: Wafe, Mgjbot, Ptak82, Nickolay, NickolayBot, Arunranga, Mathieu Deaudelin, Dria, Pmsyyz, Waldo, JdeValk
 Last updated by: Wafe,