Communication between JavaScript and Flash

When Flash is placed in an HTML container, it often encounters communication problems between AS and JS, such AS whether JS can call variables and methods in AS, and whether AS can call variables and methods in JS. The answer is yes. With the continuous development of technology, there are also a variety of solutions.
In my summary"Static" value transfer between HTML and FLASHThe article mentioned that JS uses the SetVariable method to set the variables in FLASH and thinks this method is outdated. I agree to this, but the above focus is not on the communication between JS and AS. Therefore, we also make a personal summary of AS and JS communication. You are welcome to discuss it.
Currently, many methods are available for communication between JS and AS,Early methodsThe ease of use and functionality are not perfect. The following is a brief description:

1. getURLGetURL ("javascript: history. go (-1 )");

You can use the URL protocol to access javascript on the page. The code that controls the browser's history is familiar. For example, this method is often used to customize the page favorites and send emails. Although you can also call JS functions defined on the page, I personally think that the limitations are still relatively large. The parameter transfer of functions is not very flexible and there is no return value, in addition, it can only implement AS to call JS, but not vice versa.

II. fscommand command
Using fscommand to call the AS-defined method is also a very common method, but we need to define a myFlash_DoFSCommand function with the specified format on the HTML page, first, I personally think this function is difficult to define, and I can only implement AS to call JS without returning function values.

III. SetVariable
The above two methods can only implement AS to call JS, while SetVariable is just the opposite. AS long AS we handle it a little bit, he can help us call the methods in the AS in disguise. The general idea is AS follows: set a state variable in AS and monitor it using the watch method of the Object. JS uses SetVariable to modify this state variable. Once the variable changes are detected, then you can choose to execute the corresponding function in AS according to different status values. If you need to consider a player of a lower version, you can consider this method. I personally think it is more flexible.

We can see that these practices have some limitations, so we have to use them in combination in many cases. Which of the following isExternalInterfaceYou can easily implementBidirectional method call between AS and JSTo solve the two-way variable access. For details, see the FLASH help document and Adobe official tutorial. The following two simple examples are used to illustrate the use of ExternalInterface.

I. AS method for calling JS (Instance demo)

Code in Flash:
// Import the package
Import flash. external .*;
Get_btn.onRelease = function (){
// Call JS functions on the page
Var temp_str = String (ExternalInterface. call ("say", "Hello, World "));
Result_txt.text = temp_str;
}
Code in Html:Function say (txt ){
Return txt;
}

That's right. It's that simple. JS function definition does not have any requirements. You can use the call method in AS to call it directly.

II. JS calls the AS method (Instance demo)

Code in FLASH:// Import the package
Import flash. external .*;
// Provide the function name for JS access
Var _ method: String = "say ";
// Specify the scope of this variable in the local function. It can be set to null and left empty.
Var e_area: Object = null;
// AS internal function name
Var method: Function = say;
// Register the function to the container list
Var wasSuccessful: Boolean = ExternalInterface. addCallback (_ method, e_area, method );
// Check whether the registration is successful
If (wasSuccessful ){
Result_txt.text = "function registration successful ";
}
// Local function
Function say (txt: String ){
Result_txt.text = txt;
}
Code in Html:<Div>
<Form>
<Input type = "button" onclick = "callExternalInterface ()" value = "JS call AS method"/>
</Form>
<Script>
Function callExternalInterface (){
ThisMovie ("demo"). say ("Hello, World ");
}
// The browser is compatible with DOM
Function thisMovie (movieName ){
If (navigator. appName. indexOf ("Microsoft ")! =-1 ){
Return window [movieName]
}
Else {
Return document [movieName]
}
}
</Script>
</Div>
The red code is the core code, and its function is to register the internally defined methods of AS called from the container through the addCallback function, you can customize another method name for JS to call this method. If the function is successfully called, true is returned. If the function fails, flase is returned. In this example, the wasSuccessful variable is used to determine whether the function is successfully registered. After the function is successfully registered, JS can access the SWF object through DOM, and then directly call the predefined method.

Through comparison, we can see that the code can be simpler, clearer, and more powerful when ExternalInterface is used for communication between AS and JS. However, you need to know some details,More than 8.0 of the players are required, and the called JS functions cannot be recursive. Security domain restrictions must also be considered..