尽管 Flash 已经没落，仍然有许多优秀的 Flash 游戏陪伴我们成长。使用 Ruffle 这一开源 Flash Player 模拟器，可在所有现代操作系统和浏览器上本地运行，无需大惊小怪即可让 Flash 内容栩栩如生。

安装 Ruffle#

对于想要在本地运行 Flash 文件的用户，在官网下载安装包即可。如果只想在浏览器中运行 Flash 文件，可以直接安装浏览器扩展。

嵌入 HTML 网页#

如果你是网站管理员，并且希望用户不需要安装任何插件即可运行网页上的 Flash 内容，那么只需要几行代码，即可嵌入 Flash 内容。

Ruffle 可以自动替换网站上任何带有 Ruffle 元素的旧式 Flash 嵌入，只需要在网页中包含以下脚本标签：

<script src="https://unpkg.com/@ruffle-rs/ruffle"></script>

下面是嵌入到 HTML 文件中的 Flash 的简单示例，其中 movie.swf 即为需要运行的 Flash 文件：

<body>
    <object>
        <embed src="movie.swf" width="550" height="400" />
    </object>

    <script src="https://unpkg.com/@ruffle-rs/ruffle"></script>
</body>

或者使用 JavaScript API 调用 Ruffle，下面是使用 Ruffle JavaScript API 播放位于 Web 服务器根目录中的 SWF 文件的示例，其中 movie.swf 即为需要运行的 Flash 文件：

<script>
    window.RufflePlayer = window.RufflePlayer || {};
    window.addEventListener("load", (event) => {
        const ruffle = window.RufflePlayer.newest();
        const player = ruffle.createPlayer();
        const container = document.getElementById("container");
        container.appendChild(player);
        player.load("movie.swf");
    });
</script>
<script src="https://unpkg.com/@ruffle-rs/ruffle"></script>

下面是一个浏览器最大界面运行 Flash 文件的完整网页示例：

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>游戏名称</title>
    <style>
        /* 确保html和body元素占满整个屏幕 */
        html, body {
            height: 100%;
            margin: 0;
            overflow: hidden; /* 隐藏滚动条 */
        }
        /* 使容器和Ruffle播放器全屏和自适应 */
        #container {
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        #container ruffle-player {
            flex-shrink: 0; /* 防止播放器被压缩 */
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body>
    <div id="container"></div>
    <script src="//unpkg.com/@ruffle-rs/ruffle"></script>
    <script>
      window.addEventListener('load', async () => {
          const ruffle = window.RufflePlayer.newest();
          const player = ruffle.createPlayer();
          const container = document.getElementById('container');
          container.appendChild(player);
          player.load('game.swf');
      });
    </script>
</body>
</html>

新建一个文本文档并重命名为 index.html，将以上网页示例代码粘贴到 HTML 文件中，并将 game.swf 指定为你需要运行的 Flash 游戏。在该 HTML 文件目录下打开终端，使用 python 命令 python -m http.server 快速创建一个本地服务器，然后在浏览器中打开 http://127.0.0.1:8000 即可查看自己的 Flash 游戏网页。

跨域问题#

如果运行 Flash 的网页地址为 play.example.com，但运行的 Flash 文件 game.swf 存放在另一个网页 flash.example.com 中，如果没有配置跨域访问，便会在运行网页看到类似错误：

跨域错误

此时按下 F12 打开浏览器控制台即可看到类似跨域错误：

跨域错误控制台

如果你同样使用了 Cloudflare 来托管网站，那么可以采取以下措施。

来到 Flash 文件所在 域名 - 规则 - 转换规则 - 修改相应头 下 创建规则 。

规则名称 随便填。

当传入请求匹配时…

字段	运算符	值
主机名	等于	`flash.example.com`

flash.example.com 即为存放 Flash 文件的地址。

则…

设置静态：Access-Control-Allow-Methods = GET,HEAD,POST,OPTIONS。

设置静态：Access-Control-Allow-Origin = *。

然后 部署 。

然后即可在网页里享受 Flash 游戏。

安装 Ruffle#

嵌入 HTML 网页#

跨域问题#

参考：#