flash: ExternalInterface works with embed tag but not with object tag

Question

The "modern" updated way to embed a flash object, according to Adobe:

        <object id="theFlash" name="theFlash" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" 
         width="400" height="225" align="middle">
            <param name="movie" value="theflashfile.swf" />
            <param name="allowScriptAccess" value="always" />
            <!--[if !IE]>-->
            <object type="application/x-shockwave-flash"
             data="getStreamFrame.swf" width="400" height="225">
            <param name="allowScriptAccess" value="always" />
            <!--<![endif]-->
            <a href="http://www.adobe.com/go/getflash">
                <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
            </a>
            <!--[if !IE]>-->
            </object>
            <!--<![endif]-->
        </object>

When trying to call an AS3 function in the SWF, from Javascript:

     var flashObj = document.getElementById('theFlash');
     flashObj.someASFunction();

(and on the AS side:)

     import flash.external.*;
     function someASFunction() {
        //show some text
     }
     ExternalInterface.addCallback("someASFunction", someASFunction);

This doesn't work in Firefox and Chrome. The flash works and loads. flashObj does get a reference to the object, but someASFunction is undefined and doesn't get called.

If I replace the object tag with an embed tag:

   <embed id="theFlash" name="theFlash" height="225" width="400" align="middle" 
    type="application/x-shockwave-flash" allowscriptaccess="always"
    src="theflashfile.swf" />

Then it works on Firefox and Chrome (the AS function is called and works properly) - (it doesn't work in IE though).

How come it doesn't work with an object tag?
How "safe" it is to use the embed tag instead of the object tag? Is it not obsolete?

Note, that it is definitely not a timing issue - If I call the AS function from JS from an onclick function - then the results are the same.

The embed tag is included in the HTML5 spec. http://html5doctor.com/element-index/#e — Lars Blåsjö, Sep 19 '11 at 20:39
I'm running into the same issue. When using swfobject 2.2, Chrome gets the object tag, and then my AS function does not work. If I use swfobject 1.5, Chrome gets the embed tag, and my AS function works. I would like to use the latest swfobject, but I also need my AS function to work. Any updates here? — Nick B, Apr 13 '12 at 18:19
Someone found a solution? I'm using SwfObject 2.2 like Nick and IE doesn't execute calls to flash :( — DanielB, Jun 08 '12 at 16:43

score 4 · Answer 1 · answered Nov 10 '12 at 12:53

When using the recommended Adobe method, I also failed to target the flashmovie in FF and Chrome. I ended up using the following code and ExternalInterface works just fine in all browsers

    <div id="flashContent">

        <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="619" height="99" id="myFlashMovie" align="middle">
            <param name="movie" value="myFlashMovie.swf" />
            <param name="quality" value="high" />
            <param name="bgcolor" value="#f2f2f2" />
            <param name="allowScriptAccess" value="sameDomain" />
            <!--[if !IE]>-->
            <embed src="myFlashMovie.swf" quality="high" bgcolor="#f2f2f2"
             width="619" height="99" name="myFlashMovie" align="middle"
             play="true" loop="true" quality="high" allowScriptAccess="sameDomain"
             type="application/x-shockwave-flash"
             pluginspage="http://www.macromedia.com/go/getflashplayer">
        </embed>
            <!--<![endif]-->
        </object>

For targeting the flash movie, I use this java script

        function sendDataToFlash(data) {

            getFlashMovie("myFlashMovie").myCallbackInFlash(data);

        }

        function getFlashMovie(movieName) {
            var isIE = navigator.appName.indexOf("Microsoft") != -1;
            if(isIE) return window[movieName];
            else return document[movieName];

        }

score 1 · Answer 2 · answered Sep 19 '11 at 17:20

for static embedding (which i like more) i use this code (this one is for my invisible mp3 player):

<object style="position:fixed" id="1pixPlayer" width="1" height="1" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000">
    <param value="transparent" name="wmode">
    <param value="1pxMp3.swf" name="movie">
    <param value="always" name="allowScriptAccess">
<embed name="1pixPlayer" width="1" height="1" type="application/x-shockwave-flash" wmode="transparent" allowscriptaccess="always" src="1pxMp3.swf"></object>

4xy · Answer 3 · 2014-04-17T13:45:08.260

For me it starts working if I assign a distinct id to the nested object tag and make calls to exactly this object.

        <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100%" height="100%" id="launcher"
                align="middle">
            <param name="movie" value="/flex-frontend/launcher.swf?version=1.3"/>
            <param name="flashvars"
                   value="sessionId=${session.id}"/>
            <param name="wmode" value="direct"/>
            <param name="allowFullScreen" value="true"/>
            <param name="bgcolor" value="#000000"/>
            <!--[if !IE]>-->
            <object type="application/x-shockwave-flash" id="launcher1" data="/flex-frontend/launcher.swf?version=1.3"
                    width="100%" height="100%">
                <param name="flashvars"
                       value="sessionId=${session.id}"/>
                <param name="wmode" value="direct"/>
                <param name="allowFullScreen" value="true"/>
                <param name="bgcolor" value="#000000"/>
                <!--<![endif]-->
                <a href="http://www.adobe.com/go/getflash">
                    Flash player version not less than 10.3 is required!
                </a>
                <!--[if !IE]>-->
            </object>
            <!--<![endif]-->
        </object>

Then from javascript:

// This doesn't work
// var flashObj = $("#launcher");
// But this does
var flashObj = $("#launcher1");
var screenshotData = flashObj.get(0).exportScreenshot();

Work for both Chrome and FF.

flash: ExternalInterface works with embed tag but not with object tag

3 Answers3