Worker not found when loading ffmpeg with angular
Closed this issue · 1 comments
Describe the bug
I just created an angular project and i'm using ffmpeg.wasm to process videos given by the user. After creating a webworker load ffmpeg but the load method require a worker.js file that i don't know how and where to create.
To Reproduce
const baseURL = `https://unpkg.com/@ffmpeg/core@0.12.10/dist/esm`;
export class AppComponent {
private ffmpeg = new FFmpeg();
constructor() {
if (typeof Worker !== 'undefined') { // Create a new
const worker = new Worker(new URL('./app-component.worker', import.meta.url));
worker.onmessage = ({data}) => {
console.log(`page got message: ${data}`);
};
worker.postMessage('hello');
this.loadFFmpeg().then(
() => console.log('loaded')
);
} else {
// Web workers are not supported in this environment.
// You should add a fallback so that your program still executes correctly.
}
}
private _loaded = false;
get loaded(): boolean {
return this._loaded;
}
async loadFFmpeg() {
this.ffmpeg.on('log', ({message}) => {
this._message = message;
});
await this.ffmpeg.load({
coreURL: await toBlobURL(`${baseURL}/ffmpeg-core.js`, 'text/javascript'),
wasmURL: await toBlobURL(`${baseURL}/ffmpeg-core.wasm`, 'application.wasm'),
})
this._loaded = true;
console.log("Loaded !");
}
}Expected behavior
I want to make ffmpeg.wasm load just to process a video. For the moment,
Desktop (please complete the following information):
- OS: Ubuntu 24.4.1 LTS
- Browser Firefox
- Version 125.0.2
Smartphone (please complete the following information):
/
Additional context
I'm learning angular on the job and at the same time of ffmpeg.wasm so i may have not understood everything. I'll need to process video using websocket messages next, is it possible ?
Thank you in advance
Took the worker from core-mt@0.12.9 on unpkg.com because i need multi threading and i didn't saw there was one for mt. I don't have the error anymore but the load method is stuck and never stop loading. After looking at the worker it's like the first message received by it is not handled:
Received message :
Object { id: 0, cmd: "LOAD", data: {…} }
cmd: "LOAD"
data: Object { coreURL: "blob:http://localhost:4200/d5e7ef35-ab3e-4d10-a323-889a43f0f114", wasmURL: "blob:http://localhost:4200/61a6fcd6-5a9d-4e85-8a69-59ef7e8f1cbb" }
coreURL: "blob:http://localhost:4200/d5e7ef35-ab3e-4d10-a323-889a43f0f114"
wasmURL: "blob:http://localhost:4200/61a6fcd6-5a9d-4e85-8a69-59ef7e8f1cbb"
<prototype>: Object { … }
id: 0
<prototype>: Object { … }
915cfded-839e-42e4-b5a9-ea573ef5e2f6:28:13
But the worker take a cmd from it and not a type. Tried to change type to cmd but the load cmd is not handled to.
