Frequently Asked Questions For Users - ruffle-rs/ruffle GitHub Wiki

What is Ruffle?

Flash Player has been removed from browsers in 2021. As of now, the only ways of using the official player is using desktop players, alternative browsers or obsolete versions of browsers. Ruffle is a project that allows running Flash content in the browser without the official player.

When will the game I want to play work?

There is no single release date. Development is in progress, and as it progresses, simple content will start working first, while more complex content will follow later. However, as of right now (July 2024), Ruffle now has good support for AVM2, and it's our experience that most games are playable. We're still rapidly improving in this area though, so bug reports about any broken content are always welcome! See the ActionScript 3 API Implementation page for advanced implementation details of current API support.

What if I really want to play this content?

While you can no longer run Flash Player in modern browsers, you can still run SWF files in the official desktop Flash Player. You can also research other projects like Flashpoint or Lightspark.
To obtain the SWF file from an online Ruffle emulator, open the context menu on the Ruffle container, then click "Copy Debug Info"- the SWF URL should be included in the debug info. Alternatively, the Ruffle extension has a toggle to show a "Download SWF" button in the context menu.

Can I install Ruffle on my mobile device?

Ruffle now has an official Android app! Development is still in the early stages though; you will need to manually download and install the APK, and some important quality-of-life features are missing. If you're on iOS or don't want to install an APK, you can still play Flash content using the Ruffle Web Demo, assuming that you have SWF files downloaded to your device. Websites that self-host content using Ruffle work on mobile devices too. For example, the Internet Archive has a constantly growing collection of Flash files running via Ruffle in your browser - no download required.

Another option for Android users is to install the Ruffle Firefox extension or install the Ruffle Chrome extension using the Kiwi Browser.

The virtual keyboard should appear when you click an editable text field, but keyboard controls in games may be unusable without a physical keyboard. You can work around this by opening the touch keyboard from the taskbar on Windows or by using Hacker's Keyboard on older versions of Android. You must then enable 'use permanent notification' in its settings. It will then show a persistent notification which you can tap on to invoke the keyboard at any point. But this does not work anymore in Android 12!

How can I use Ruffle with local HTML files?

Ruffle cannot run directly on local HTML files because of browser limitations, so you'll need to access the files via a local web server. One such turn-key option is to install Simple Web Server. Or if you have Python, you can run this command from the folder containing your files: python -m http.server.

I'm trying to use ruffle on Microsoft Edge, but it runs extremely slowly or I get a "Something went wrong" error.

A browser setting is likely interfering with WebAssembly, which Ruffle requires to run. To fix this problem, follow the steps below.

Open Microsoft Edge's settings
Click the "Privacy, search and services" tab on the left
Turn off "Enhance your security on the web"

If you don't want to turn off this setting completely, you can add exceptions for specific sites to allow Ruffle to run. See this Microsoft documentation for more information.

How do I uninstall Ruffle?

The Ruffle desktop app is portable; just delete its folder to uninstall it.

The extension can be uninstalled by right-clicking on the extension and selecting the "Remove" option. It can also be uninstalled from chrome://extensions (in Chrome or Chromium-based browsers) or about:addons (in Firefox).

If Ruffle is still running on a website after you uninstalled the extension, that means that the site is self-hosting Ruffle - it’s already part of the website itself. If you don't want to use Ruffle, you'll have to visit a different website.

Why does Windows Defender warn me when I try to open Ruffle?

Windows Defender takes some time to begin recognizing new files as safe to run. Because a new version of Ruffle is released every day, Windows Defender does not always have enough time to recognize that Ruffle is safe. The warning can be safely ignored - just click "More info", then "Run anyway."

Ruffle is laggy or slow in Chrome specifically, even when playing simple SWFs. What can I do?

This can happen when hardware acceleration is disabled in Chrome. To enable hardware acceleration, follow these steps:

Click the menu button at the top-right of your Chrome window, then click Settings.
On the left sidebar, click System.
Turn on "Use hardware acceleration when available."

When browsing the Wayback Machine, I see an error screen instead of the expected Flash content:

Ruffle failed to load the Flash SWF file. Access to fetch has likely been blocked by CORS policy.

On Wayback Machine specifically, this error message indicates that the content was unfortunately never archived. We hope to clarify this error message in the future. There is likely nothing you can do unless the content is available from another source.

How do I make Ruffle start playing content automatically when a page first loads like Flash Player?

Unlike Adobe Flash player, modern browsers don't allow content to begin playing audio without user interaction. If Ruffle automatically began playing the visuals but not the audio of content that was meant to start with audio, the audio could become de-synced when it does begin, so the content pauses altogether until it has been interacted with, and Ruffle shows an orange play button.

Additionally, unlike Flash Player, Ruffle currently does not support streamed loading of content. Because some content could take a long time to load, and also Ruffle itself can take a while to load as it uses a several megabyte large WebAssembly file, a splash screen was added to indicate that progress occurred.

However, all of that is just the default behavior. If your content is not meant to start playing audio before interaction anyway, the play button is unnecessary. Also, the splash screen could look strange on old-Flash based websites, and is not as necessary if the Flash content loads quickly anyway (though Ruffle itself can still take some time to load).

If all of that is the case and you are using the extension: You can click the Ruffle symbol to enable the option "Autoplay Flash content (click to unmute)"

If all of that is the case and you are self-hosting Ruffle, you can use these configuration options (see https://github.com/ruffle-rs/ruffle/wiki/Using-Ruffle#configuration-options):

window.RufflePlayer.config = {
     // Start playing the content automatically, without audio if the browser in use does not allow audio to autoplay
    "autoplay": "on",
    // Do not show an overlay to unmute the content while it plays; when the content area receives its first interaction, it will unmute
    "unmuteOverlay": "hidden",
     // Do not show a splash screen before the content loads; the content area will remain blank until Ruffle fully loads the content
    "splashScreen": false,
}

How do I change the fonts used by Flash on my website?

Unfortunately we aren't able to use users actual device fonts, and we only provide one font ourselves currently (Noto Sans) - so a lot of content that relied on device fonts may look slightly wrong, or in some cases not render any characters at all (such as CJK texts).

To workaround this, you can provide your own fonts and configure ruffle to treat these as if they were device fonts.

We support TTF, OTF, TTC, and OTC fonts, as well as SWFs containing fonts. To load TTF fonts, for example, you can do something like below:

window.RufflePlayer.config = {
    fontSources: ["NotoSans-Bold.ttf", "NotoSans-Italic.ttf"]
}

To create an SWF containing fonts, you can do the following:

Create a new document in Flash Pro or Animate, make sure it's ActionScript 3 (screenshot)
On the right hand side, click the Library tab and right click somewhere in the big empty space, and hit New Font (screenshot)
Set the name, pick the font and style from the list, and then choose which characters you want to embed. Only these characters will be available to use from this font. (screenshot)
In the ActionScript tab, check "Export for ActionScript" to make sure it stays inside the swf, and make sure it's "DF3" not "DF4" (screenshot)
Export the SWF. Make sure you export it as a SWF. (screenshot 1 screenshot 2)
Configure Ruffle to load that SWF as a font source.

window.RufflePlayer.config = {
    fontSources: ["my-big-fonts.swf"]
}

If you need to override one of the default fonts, you can use defaultFonts in addition to fontSources to change the default font definition. There are 3 default fonts in Flash, _sans _serif and _typewriter - in Ruffle they are normally all set to Noto Sans, but you can replace it such as:

window.RufflePlayer.config = {
    fontSources: ["fonts.swf"], // load up fonts here
    defaultFonts: {
        sans: ["Caveat"], // then replace them here.
        // serif: ["Font Name 1", "Font Name 2"], // Multiple fonts can be provided
        // typewriter: ["Noto Sans"], // typewriter is normally a monospace font
    }
}

How can I connect to a TCPSocket or XMLSocket from the web?

Browsers do not allow arbitrary TCP connections, so whilst we support this normally on Desktop, on Web this doesn't work out of the box due to browser limitations.

Fortunately, we provide a workaround to allow you to proxy all traffic through a websocket connection, satisfying Browser security limitations whilst being completely invisible to the Flash content.

We recommend installing Websockify as the proxy, but you may use similar software or even modify your existing game servers to take in Websocket connections.

Websockify example

For the purposes of this example, we'll assume that your normal game server is example.org on port 1234. This will create a proxy server on localhost, port 8181.

Make sure Python 3 is installed and available.
Download the latest release of Websockify and extract it somewhere.
Run python3 setup.py install from within the Websockify folder.
Start the server with: websockify 8181 example.org:1234
Configure ruffle to proxy any connections with the following snippet:

window.RufflePlayer.config = {
  socketProxy: [
    {
      host: "example.org", // The address of the server that Flash tries to connect to
      port: 1234, // The port that Flash tries to connect to
      proxyUrl: "ws://localhost:8181", // The actual proxy that Ruffle will connect to, instead of the above server
    }
  ]
};

For long term use, you can tell websockify to run in the background with -D, or consider using their docker image. Consult the Websockify documentation for full details, including how to run the websocket over SSL.

Multiple servers through Websockify

If you have multiple servers you need to proxy to, instead of hosting 1 Websockify instance per server, you can configure it to proxy based on the URL of the websocket.

For this example, we'll assume you have two servers, example.org:1111 and example.com:2222. We'll make a proxy on localhost, port 8181, that will redirect the traffic as needed.

First make a file servers.txt and write the contents like such:

game1: example.org:1111
game2: example.com:2222

Then start up websockify with the following command: websockify --token-plugin ReadOnlyTokenFile --token-source servers.txt 8181

And finally, configure Ruffle to use it:

window.RufflePlayer.config = {
  socketProxy: [
    {
      host: "example.org",
      port: 1111,
      proxyUrl: "ws://localhost:8181/?token=game1", // The token argument is the name of the server, as defined in servers.txt
    },
    {
      host: "example.com",
      port: 2222,
      proxyUrl: "ws://localhost:8181/?token=game2",
    }
  ]
};

How do I sponsor this project?

You can sponsor us via OpenCollective or GitHub Sponsors. Thank you!