用ActionScript與JavaScript實現Flash與網頁的交互

時間 2019-11-16

標籤 actionscript javascript 實現 flash 網頁交互欄目 JavaScript 简体版

原文原文鏈接

Flash與網頁交互效果圖
javascript

Flash有強大的繪圖功能、圖形功能，可以與網頁的參數傳遞聯繫起來，配合後端的服務器語言，可以收到很大效果。不過這樣編程比較麻煩，要調試Flash，而後要放到服務器上調試。html

1、Flash部分java

一、首先，新建一個ActionScript3.0的Flash，新建以後就保存爲webPage.fla，此次的Flash無須這麼大的尺寸，不然網頁中會有不少的留白，設置大小爲500x100px就能夠了。web

二、經過窗口->組件，或者Ctrl+F7打開組件面板，利用自帶的按鈕、標籤文本、輸入框組件佈置界面。編程

三、拖出以下的界面，設置各個組件的屬性以下，設置其text值，也就是要顯示的文字，爲部分要控制的組件設置實例名稱，也就是Id，好比按鈕設置成Button1，輸入框設置成EditField1，一下子要給網頁JavaScript控制的標籤文本的text值清空，其實例名稱爲Label1。後端

四、以後點擊第一幀，打開動做面板，或者點擊F9，寫入以下的代碼：瀏覽器

import flash.external.ExternalInterface;服務器

flash.system.Security.allowDomain("*");
flash.system.Security.allowInsecureDomain("*");//設置容許全部網站都容許Flash與網頁之間交互app

Button1.addEventListener("click",function(){//點擊Button1這個按鈕函數

ExternalInterface.call("show",EditField1.text);
//則調用JavaScript中的function show(message){}函數，其中message這個參數值，由EditField1輸入的東西填充

});

function JavaScriptShow1(message1){

//定義一個函數，一旦這個函數觸發則把傳來的值，填充Label1這個標籤文本
Label1.text=message1;

}
ExternalInterface.addCallback("JavaScriptShow1",JavaScriptShow1);
//註冊JavaScriptShow1這個函數，其對外名稱爲JavaScriptShow1，通常都應該相同的
//網頁調用Flash對象的JavaScriptShow1的方法，則至關於調用ActionScript中的JavaScriptShow1(message1){}函數

五、此時Flash的部分完畢，選擇文件->發佈，打開Flash保存的文件夾，你會發現生成了swf文件。。

2、網頁的部分

一、以後，要把這個Flash佈置到網頁上。Flash發佈以後，會在網頁中生成兩個東西一個html與一個swf，核心文件是.swf文件，html文件不能照搬的，只能借鑑其中的代碼，不然不能兼容火狐、谷歌等瀏覽器。

這個由Flash生成webPage.html頁面，能夠借鑑的代碼以下：

二、因爲Flash禁用了Flash調用本地文件的功能。你只能把這個webPage.swf拷貝到你的服務器上調試。以後在服務器上新建一個.html的頁面，這裏以swf.html與webPage.swf同目錄作例子，若是不一樣例子請本身設置好絕對路徑，假設是swf.html，swf.html的HTML佈局以下：

<!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="zh-CN" xml:lang="zh-CN">

<head>
    <title>webPage</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />        
</head>
<body>
    Flash與網頁交互
    <input type="text" id="text1" />
    <button onclick="toFlash()">發信息給Flash！</button>
    <!--這段代碼的部分能夠在發佈出來的html中截取-->
    <div>            
        <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="500" height="100" id="webPage" align="middle"><!--這裏的id是爲了flash給IE系列瀏覽器控制-->
            <!--對IE有效的代碼-->
            <param name="movie" value="webPage.swf" /><!--爲IE瀏覽器指明flash的路徑-->
            <param name="quality" value="high" />
            <param name="bgcolor" value="#ffffff" />
            <param name="play" value="true" />
            <param name="loop" value="true" />
            <param name="wmode" value="window" />
            <param name="scale" value="showall" />
            <param name="menu" value="true" />
            <param name="devicefont" value="false" />
            <param name="salign" value="" />
            <param name="allowScriptAccess" value="always" /><!--這裏必定要設置成always，打開Javascript與Actionscript的交互權限-->
            <!--對野狐禪、谷歌等有效的代碼-->
            <embed src="webPage.swf" width="500" height="100" id="webPage"></embed><!--這裏的id是爲了flash給野狐禪、谷歌等瀏覽器控制，src的值爲野狐禪、谷歌等瀏覽器指明flash的路徑-->
        </object>
    </div>
</body>

</html>
以後的JavaScript佈局，是ActionScript與JavaScript交互的核心，代碼以下：
<script type="text/javascript">

//給ActionScript所調用的JavaScript函數，message這個參數被ActionScript傳遞過來的值所填充
function show(message){    
    alert(message);
}

//獲取Flash對象的函數，不一樣的對象有不一樣的方法。爲了兼容，只能這樣寫。
function getFlash(movieName){
    if (window.document[movieName]) {
        window.document[movieName];
    }
    if (navigator.appName.indexOf("Microsoft Internet") == -1) {
        if (document.embeds && document.embeds[movieName]) 
            return document.embeds[movieName];
    }
    else {
        return document.getElementById(movieName);
    }
}

//獲取Flash對象
var flash1 = getFlash('webPage');

//JavaScript調用ActionScript中註冊爲JavaScriptShow1的函數
function toFlash(){
    var text1 = document.getElementById("text1").value;
    flash1.JavaScriptShow1(text1);
}

</script>

3、總結

綜上所述，webPage.swf與swf.html的交互以下圖：