ffmpegwasm / ffmpeg.wasm

FFmpeg for browser, powered by WebAssembly
https://ffmpegwasm.netlify.app
MIT License
14.01k stars 816 forks source link

No longer works in a browser #502

Open AmogusJS opened 1 year ago

AmogusJS commented 1 year ago

Describe the bug The latest version of ffmpeg.wasm no longer works in a web browser: the 'ffmpeg.FS' function tries to fetch files from the non-existent path.

To Reproduce Steps to reproduce the behavior:

  1. Load the latest version of the library from a CDN in your html file, for example: <script src="https://cdnjs.cloudflare.com/ajax/libs/ffmpeg/0.11.6/ffmpeg.min.js"></script>

  2. Now, add the following script (but any script involving the filesystem function will produce a similar error)

    
    <script>
    const {
        createFFmpeg,
        fetchFile
    } = FFmpeg;
    const ffmpeg = createFFmpeg({
    log: true
    });

const demo = async () => { await ffmpeg.load(); ffmpeg.FS('writeFile', 'audio.ogg', await fetchFile('../assets/audio.ogg')); }

demo()



3. Open the devtools console (F12) and the following error will be logged there:
> GET /home/jeromewu/repos/ffmpeg.wasm/src/assets/audio.ogg net::ERR_FILE_NOT_FOUND

The library tries to fetch files from the non-existent path instead of using the path on your server like it did in previous versions.

❌/home/jeromewu/repos/ffmpeg.wasm/src/assets/audio.ogg
✅ localhost:8080/assets/audio.ogg

For example, the older version of the library in this official repo https://github.com/ffmpegwasm/chrome-extension-app/tree/master/vendor will load its resources from correct path.

**Expected behavior**
The library fetches file from the correct path on your server instead of using the '/home/jeromewu/repos/ffmpeg.wasm/src/assets' path.

**Screenshots**
![amongi](https://github.com/ffmpegwasm/ffmpeg.wasm/assets/135548778/dd1fa914-c1ad-4548-9d27-4ccac56dc5d8)

**Desktop (please complete the following information):**
Chrome 114