js與flash交互

1.背景

    近期項目中遇到了js和flash交互相關工作內容,在此記錄一下通過這次開發瞭解到的js和flash交互基本操作及一些坑。

    flash是一種瀏覽器的插件,使用AS編寫。它的引入方式和其它資源類似,都是在html標籤裏指定其存放地址。

2.js與flash的交互

    js與flash交互涉及兩個方面:js調flash的接口;flash調js的接口。

    js調flash接口很簡單,只需要創建一個object標籤,然後在這個標籤裏寫入flash的url。當這個object標籤加載好,就可以調用了,調用的形式形如 swfElement.someAPI()。其中swfElement是這個標籤對應的DOM,someAPI是flash提供的接口。舉例如下:

    <object id="flashDemo" type="application/x-shockwave-flash" data="http://127.0.0.1:8081/flashDemo.swf">
    <param name="movie" value="http://127.0.0.1:8081/flashDemo.swf">
    <param name="allowscriptaccess" value="always">
    <param name="wmode" value="opaque">
    </object>

    flash調js則需要在window下掛上一個約定好的對象,然後js把調用方法放到其中,然後flash通過調用這些方法(可以傳參數,注意參數應爲JSON字符串),來進行回調交互。

3.坑

    flash的object元素如果沒有顯示出來,是沒法調用其接口的;

    當我們調用設備時,會彈出一個默認的授權框,而且是每個flash實例(一個object)調用設備時,都會彈出一次。

    需要用戶手動確認的這個彈框,如果你擋住其中一部分,則上面所有按鈕都無法點擊,這可能是爲了防止前端強制用戶選擇。

    如果你在點擊關閉的同時,隱藏object,會導致報錯。

    chorme的object無法監聽到click事件,只能監聽到mouseup事件,firefox的object無法監聽到mouseup事件,只能監聽到click事件

    flash調用本地設備時,儘量保持flash顯示且樣式不變。在一些瀏覽器(QQ,360)的兼容模式下,如果在flash調用本地設備時,將其移位隱藏(left: -2000),則可能會導致flash崩潰,進而整個網頁崩潰。

    chrome禁用flash後,指向flash官網的鏈接的a標籤會被屏蔽掉。

    因爲在每次重新進入網頁時,默認是禁止flash的本地設備權限的,所以當flash調用授權彈框後,彈框的默認選項應該爲允許,可是當你允許之後再刷新,默認就爲允許了,而此時flash並未獲得設備權限,導致狀態和顯示不一致的問題。解決方案是,在彈框的flash加入到DOM之前,先在DOM裏塞一個臨時的flash的Object,這個臨時的Object只要是flash就行沒有其他要求,這樣就可以保證每次重新進入授權彈框默認都爲拒絕了。(不知道瀏覽器的這個特性的原因,而且,即使你不在彈框flash的Object引入之前先引入一個臨時的flash的Object,而在瀏覽器的其它標籤頁有flash的Object存在,也可以使當前頁面的flash授權彈框默認爲拒絕)

發佈了59 篇原創文章 · 獲贊 42 · 訪問量 10萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章