Flex / ActionScript 3 : Problem with ExternalInterface.addCallback

I'm adding some functionality to an existing Flex project that requires cross talk between ActionScript and Javascript. Reaching from ActionScript to Javascript is pretty easy. This can be done with the ExternalInterface.call. Calling from Javascript to ActionScript was a little tricker. Especially with local development.

You can use ExternalInterface.addCallback to create a bridge for Javascript to talk with ActionScript. There are a few more steps to make sure this is set up properly.

1) Make sure the id and name are the same in each AC_FL_RunContent function. Just changing one won't work. This way document.getElementById should always find the object on the page.
2) Make sure allowScriptAccess is set to always in each AC_FL_RunContent function. This updates the security setting so Javascript can access the Flash object.
3) If you're doing local development make sure to check Always allow in Global Security Settings Panel.

I found step 3 after wasting an entire morning looking around the internet. Without this I kept getting this warning.

*** Security Sandbox Violation ***

SecurityDomain 'null' tried to access incompatible context 'file:///foo/bar/project.swf'

Once you're project is finished you might want to change this back. Not sure what thing on the web wants to break your computer.

Flex: New Project Settings

When starting a new Flex project there are a few settings I like to use by default.

Changes to Flex Compiler
Flex Compiler options for a project can be found by right-clicking the project and selecting properties. Select Flex Compiler from the menu on the left. The following properties should be added to the Additional compiler arguments field.

When you're reading local xml files or image you might run into a sandbox security Error# 2140 or ReferenceError Error# 1069 using the HTTPService object. Use this switch to stop the error.
-use-network=false


The loading background color of a Flex app can be changed. Use this switch to change the property.
-default-background-color [HTML COLOR VALUE]
I typically use #FFFFFF.


Changes to the Application
I like to use a simple background for Flex apps. Add this property to the mx:Application to make the background white.
styleName="plain"