AS3 ExternalInterface works in IE but not Firefox
I am trying to execute an AS3 function from my javascript using the ExternalInterface. Seems to work fine in IE, but firefox is always returning javascript error method undefined.
I have been Googling this for ages and eliminated the following possibilities:
1) Some people say you need to have an embed tag inside your object tag, so added one - no luck.
2) Many people say tha开发者_开发问答t you need to make sure that your flash is loaded before calling the javascript. Well my call is after pressing a link on the page. I am always using the flash application first and only pressing the link at the end.
3) Then I thought that maybe it is a security problem so added the following:
try {
ExternalInterface.addCallback("test", testing);
trace("added callback");
}
catch (error:SecurityError) {
trace("Security Error:"+error.message);
}
catch (error:Error) {
trace("Error:"+error.message);
}
But it prints out "added callback" :(
Anyone else have any ideas what else could I possible try? I am running the latest Firefox and FlashPlayer 10.
Regards,
Olli
Figured it out. You need to use object tag for IE and embed tag for FF. Have not tested yet with other browsers but hopefully the embed tag works for them as well.
To help other people with the same problem. Here is an HTML page that works for me :)
Regards,
Olli
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
html, body { height:100%; background-color: #ffffff;}
body { margin:0; padding:0; overflow:hidden; }
#flashContent { width:100%; height:100%; }
</style>
</head>
<script>
function testIt(){
var flashContainer;
if(navigator.appName.indexOf("Microsoft") != -1){
flashContainer = document.getElementById("test");
}else{
flashContainer = document.getElementById("test-embedded");
}
flashContainer.test("js says hello");
}
</script>
<body>
<a href="#" onclick="testIt();">Press here</a>
<div id="flashContent">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" id="test" align="middle" width="550" height="400">
<param name="movie" value="test.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<embed src='test.swf' height='400' width='550' id='test-embedded' PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></embed>
</object>
</body>
</html>
If your flash otherwise runs fine in Firefox we can safely assume there is something wrong with either the HTML wrapper or the JavaScript code that attempts to call the function. Posting those pieces would help considerably.
But, generally speaking, IE will use the <object> tag and everyone else will use the <embed> tag. I think the best idea is to use jQuery to do the flash embedding and calling, here's simple HTML code I happen to use that works on IE, Firefox and Chrome:
<object id="GAMENAME" classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000'
codebase='http://download.adobe.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0'>
<param name="allowScriptAccess" value="always">
<param name="movie" value="game.swf">
<embed id="GAMENAME" name="GAMENAME" src="game.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"
allowScriptAccess="always">
</embed>
</object>
I have a utility function to access the flash object:
function getGame()
{
if (window.document[gameName])
{
return window.document[gameName];
}
if (navigator.appName.indexOf('Microsoft Internet') == -1)
{
if (document.embeds && document.embeds[gameName])
{
return document.embeds[gameName];
}
else
{
return document.getElementById(gameName);
}
}
}
Yes, it requires the global variable gameName to be set to the name given to the flash object. In our case it would have to be "GAMENAME" to correspond to the HTML above. Did I mention this is not what I'd consider production code?
Then the call the Flash object I use something like:
getGame().test()
The JavaScript here may not be entirely sensible or otherwise represent best practices, but it does point out the problem one has in finding the embedded flash object in the the presence of <object> vs. <embed> and multiple browsers.
加载中,请稍侯......
精彩评论