解决方法 Flash 不允许从 Javascript 全屏显示

Posted 2023-02-16

【中文标题】解决方法 Flash 不允许从 Javascript 全屏显示

【英文标题】：Workaround Flash not allowing fullscreen from Javascript

【发布时间】：2011-09-07 08:19:22

【问题描述】：

问题

我有使用 html/CSS 设计的视频播放器 chrome 按钮。全屏按钮需要告诉 Flash 进入全屏状态，但 Adob​​e 禁止这种 javascript 到 Actionscript 的交互。解决此问题的巧妙方法是什么？

背景

我正在制作一个基于网络的视频播放器，它支持许多插件 - Flash、VLC、HTML5、iPhone 的 Quicktime 等...我希望所有这些播放器共享相同的 chrome 按钮 - 播放、暂停、静音、音量滑块、分辨率选择器和全屏。这些按钮使用 HTML/CSS 布局。

 ____________      ____________      ____________
|           |     |           |     |           |
|   Flash   |     |   VLC     |     |   HTML5   |       ...
|           |     |           |     |           |
-------------     -------------     -------------
[A][B][C][D]      [A][B][C][D]      [A][B][C][D]

我处理的所有插件都允许 Javascript 控制插件。这是一个如何让 HTML 元素与 HTML5 视频交互的示例。与其他插件交互时，代码几乎相同。唯一改变的是实际调用的函数名。

// Using Prototype JS library
$('playButtonId').observe(
  'click',
  function(event) 
    $('html5Id').play();
  
);

在 Flash 中全屏出现问题。在 Actionscript 3.0 中，您可以这样做以向 Javascript 公开全屏回调：

package 
 import flash.external.*

 private var theStage:Stage;

 public class Player 

  public function Player(stageReference) 
   this.theStage = stageReference;
   ExternalInterface.addCallback("fullScreen", this.fullScreen);
  

  private function fullScreen():void 
   this.theStage.displayState = StageDisplayState.FULL_SCREEN;
  
 

当 Javascript 调用 $('flashPlayerId').fullScreen(); 时，什么都不会发生，因为 Adob​​e 要求在 SWF 中单击即可触发全屏事件。这是为了防止黑客编写恶意网站来劫持用户的屏幕，而无需他们启动。

当前破解

我目前正在 Flash 中重新创建所有 chrome 按钮以支持全屏。我必须将所有图形导入 Flash 并将所有 Javascript 转换为 Actionscript。

 ____________      ____________      ____________
|           |     |           |     |           |
|   Flash   |     |   VLC     |     |   HTML5   |       ...
|           |     |           |     |           |
|           |     -------------     -------------
| A  B  C D |      [A][B][C][D]      [A][B][C][D]
-------------

这给我带来了很多痛苦和痛苦。每当我需要进行更改时，我都会更新 HTML 和 JS。这种变化反映在 VLC、HTML5 和其他播放器上。但由于 Flash 不共享相同的 HTML chrome 按钮，我必须复制 Flash/AS 中的更改。所以我正在寻找一个更好的解决方案来减少重复代码的数量。它不必在风格上干净。我只想要易于维护。

【参考方案1】：

只需为您的 Flash 电影设置 0.1% 的不透明度（您将需要使用 wmode），并将其直接放在 html 按钮上。用户点击 flash 但看到了 html。 actionscript 代码只是告诉玩家全屏，然后使用 ExternalInterface 调用一些 javascript。请赏金！

【参考方案2】：

您可以不在没有用户与 Flash 组件 IE 交互的情况下触发全屏：鼠标单击按钮。 即使您在 JavaScript 中有一个点击事件，它也不会起作用，因为该点击事件不会在 Flash 堆栈中。

[编辑] 您可以做的一种解决方法是在 flex 中构建您的应用程序并使用 css 设置按钮样式。 另一个解决方法。在 flex 中创建一个布局 swf，使用 css 设置按钮样式，并在其中加载和定位其他 swf。 解决方法需要进行一些设置，但是当您想要更改按钮时，您只需更改 css，例如图像源或颜色或您正在更改的任何内容。

【参考方案3】：

您可以使用Haxe 创建一个可以转换为 javascript 和 actionscript 的代码库。

这意味着你也必须学习 Haxe。

[编辑]

一种更简单的方法可能是创建一个包含所有图像的sprite sheet。 这样，您只需将工作表导入 css 并设置工作表视口的正确位置。然后您还可以将精灵表动态加载到 Flash 中。

那么，您唯一需要注意的是图像在精灵表中的正确位置。