Video.js Flash Fallback SWF

5.4.2 · abandoned · verified Wed Apr 22

videojs-swf is a legacy package that provides a compiled Flash (SWF) video player, designed to serve as a fallback technology for Video.js versions 5.x and below. In its era, it enabled Video.js to maintain a unified API, allowing its skins, plugins, and other features to function across both HTML5 and Flash environments, crucial for broader browser compatibility before HTML5 video was universally robust. The package, currently at version 5.4.2 (last updated in 2018), is essentially a build tool for a `.swf` asset rather than a directly importable JavaScript module. It has not seen active development in many years, aligning with the general end-of-life for Adobe Flash Player itself. For Video.js 6.x and above, the Flash tech was moved to a separate `videojs-flash` repository, though both `videojs-swf` and `videojs-flash` are now largely obsolete due to browser Flash EOL.

Common errors

Warnings

Install

Imports

Quickstart

Demonstrates configuring Video.js (v5.x, using CDN link `https://vjs.zencdn.net/5.10.8/video.js`) to use a custom Flash SWF for video playback, highlighting the `techOrder` and `flash.swf` options. Crucially notes that Flash is EOL and this example is for historical context.

<!DOCTYPE html>
<html>
<head>
  <title>Video.js Flash Fallback Example</title>
  <link href="https://vjs.zencdn.net/5.10.8/video-js.css" rel="stylesheet">
  <script src="https://vjs.zencdn.net/5.10.8/video.js"></script>
  <style>
    body { font-family: sans-serif; }
    .video-container { width: 640px; margin: 20px auto; }
  </style>
</head>
<body>
  <div class="video-container">
    <h1>Video.js with Flash Fallback (Legacy)</h1>
    <p>This example demonstrates how to configure Video.js v5.x to use a compiled Flash SWF for playback.
    <b>Note: Flash Player is no longer supported by modern browsers. This demo will likely fail to play video.</b></p>
    <video id="my-video" class="video-js vjs-default-skin" controls preload="auto" width="640" height="360"
      poster="https://vjs.zencdn.net/v/oceans.png" data-setup="{}">
      <source src="https://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
      <source src="https://vjs.zencdn.net/v/oceans.webm" type="video/webm">
      <p class="vjs-no-js">
        To view this video please enable JavaScript, and consider upgrading to a web browser that
        <a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
      </p>
    </video>
  </div>

  <script>
    // Simulate having a locally built video-js.swf file
    // In a real scenario, you would compile videojs-swf and place the output `video-js.swf`
    // in a path accessible by your web server.
    const swfPath = '/path/to/your/compiled/video-js.swf'; // REPLACE WITH ACTUAL PATH

    videojs('my-video', {
      techOrder: ['flash', 'html5'], // Prioritize Flash if available
      flash: {
        swf: swfPath // Point to the compiled SWF asset
      }
    }, function() {
      console.log('Video.js player is ready (v5.10.8)');
      console.log('Flash SWF path configured:', swfPath);
      // The player will attempt to load the Flash tech if HTML5 fails or is not preferred.
      // In modern browsers, this will almost certainly fail due to Flash EOL.
    });
  </script>
</body>
</html>

view raw JSON →