Communication between JavaScript and Actionscript (AS3) and vice versa

// April 27th, 2010 // Action Script, Flash, Javascript, Programming

I haven’t used flash for a while, and today while creating little news slider in flash which communicate with Javascript (and vice versa), i lost 30 min to find the best way to communicate between Flash and Javascript. So to save you a lot of time here is simple description.

To Call Javascript function from Flash: 

import flash.external.ExternalInterface;
...
ExternalInterface.call("my_js_function()");

To get a return value:

var el_width:int = ExternalInterface.call("get_width()");

To pass an argument try:

var el_width:int = ExternalInterface.call("get_width()", "my_el_id");

And that’s it :)

Communication with flash from javascript is a little bit harder, but if you follow these steps it sholud work.
To Communicate with Flash from Javascript you need to adjust 3 different thing HTML, JS, AS.

First HTML

The tag must have an id. For example,

The tag must be inside object and it must have a name attribute – name=”myFlashMovie”

so you will get something like this

<object height="250" width="380" id="myFlashMovie" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
<param value="myflash.swf" name="movie">
<param value="high" name="quality">
<param value="transparent" name="wmode">
<param value="#FFFFFF" name="bgcolor">
<param value="true" name="allowFullScreen">
<param value="true" name="swLiveConnect">
<param value="always" name="allowScriptAccess">

    <embed height="250" align="middle" width="380" src="myflash.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" play="true" loop="true" scale="showall" wmode="transparent" devicefont="false" bgcolor="#000000" menu="true" allowfullscreen="false" allowscriptaccess="always" salign="" type="application/x-shockwave-flash" name="myFlashMovie">
</object>

Now go to Flash.
first import ExternalInterface 

import flash.external.ExternalInterface;

and now you can prepare function which will be contacted from JS 

ExternalInterface.addCallback("sendToActionScript", receivedFromJavaScript);

function receivedFromJavaScript()
{
  //code
}

You’ll see that ExternalInterface.addCallback accept 2 params, first is name of function that you call on flash object inside Javascript, and the second one i reference to as function inside Flash.

So when you call sendToActionScript from JS, receivedFromJavaScript will be triggered inside flash.

Well, we are finished with Html and Flash. Now we’ll step into JS

Because of browser differencies you need to have little JS function which returns your flash object (well, if this function don’t work for your browser than you should google how to get flash object). 

function get_flash(flash_id)
{
var flash;
	if(navigator.appName.indexOf("Microsoft") != -1)
		flash = window.flash_id;
	else
		flash = window.document.flash_id;
return flash;

}

Remeber that our flash expect that we call sendToActionScript in JS to trigger receivedFromJavaScript function in flash, so
we will do something like this

var flash = get_flash("myFlashMovie");
flash.sendToActionScript();

And finally this should trigger Flash function.

Do you need source for this? If you do, leave a comment and i will find a time to prepare it. Also if you have any questions feel free to ask.

One Response to “Communication between JavaScript and Actionscript (AS3) and vice versa”

  1. Terry Paton says:
    July 6, 2010 at 02:10

    Thanks very much, just what I was looking for!

Leave a Reply