1

I have the code below in React.js that uses ffmpeg to convert files:

import { createFFmpeg, fetchFile } from '@ffmpeg/ffmpeg';

  const doTranscode = async () => {
    setMessage('Loading ffmpeg-core.js');
    await ffmpeg.load();
    setMessage('Uploading file');
    ffmpeg.FS('writeFile', filename, await fetchFile(file));
    await ffmpeg.run('-i', filename, 'test.wav');
    setMessage('Upload to manager complete. Sound file will be available and playable on the manger within 1-2 minutes.');
    const data = ffmpeg.FS('readFile', 'test.wav');
    setAudioSrc(URL.createObjectURL(new Blob([data.buffer], { type: 'audio/wav' })));

    var file_name = prompt('What would you like to call this file?');

    if (!file_name) {
      file_name = Date.now()
    }
    
    (async function(){
      let output = await getSoundID(customer_id, file_name);
      let sound_id = output.data;
      var bucket_file = new File([new Blob([data.buffer], { type: 'audio/wav' })], "sounds/" + customer_id + "/" + sound_id + ".wav");
      uploadFileToS3(bucket_file);
      updateSoundData(sound_id, customer_id);
    })();
  };

  useEffect(() => {
    if (file) {
      doTranscode()
    }
  }, [file])

The code above works great in Chrome and the files are successfully converted. However, when I bring it to Firefox or Edge I get this error Unhandled Rejection (ReferenceError): SharedArrayBuffer is not defined.

I looked up this issue and they said I need to modify my headers to include this:

You need to set two response headers for your document:

Cross-Origin-Opener-Policy: same-origin Cross-Origin-Embedder-Policy: require-corp

Not sure how I would this in my JS code?

Would love to hear what you guys think.

Juliette
  • 4,309
  • 2
  • 14
  • 31

1 Answers1

0

Looks like according to the docs the @ffmpeg/ffmpeg library only supports the browsers which have SharedArrayBuffer:

Only browsers with SharedArrayBuffer support can use ffmpeg.wasm, you can check HERE for the complete list.

The list above contains Edge starting from version 79 and Firefox starting from version 79.

Vitalii
  • 2,071
  • 1
  • 4
  • 5