Can electron apps play any videos supported locally?

Question

I'm aware that browsers usually restrict players to mp4 and webm type of media, but I'm wondering if it's possible for an electron-based app to run local videos with formats such as MKV and AVI. I can't find a definite source telling me what is and what is not available.

Answer 1

If you're like me and you encountered this thread after searching for something like ".mkv Electron" just be aware that the current top response is no longer accurate.

Electron now plays .mkv files natively with <video> elements along with a number of other formats likely including .Avi. Don't be like me and try to go down the horrible rabbit hole that is webchimera and trying to get it to work with electron.

Answer 2

Electron is still limited to web technologies...

This means even though you have access to the file system and whatnot through the node APIs, content rendering happens inside a BrowserWindow which has about the same support for video playback as webkit based browsers. You can use HTML5 video or canvas for this purpose, and that's pretty much it natively. (Flash is theoretically also supported, but the amount of work required to get it running is not worth it in my opinion... also, it's Flash, so, no.)

... but that's not entirely true

Even though native support ends there, you have various paths you can take to work around these limitaions. I'll list a few of the most common ones:

• Convert your MKV/AVI video in the background to one of the supported formats. This has the drawback of needing the entire video file to be present on your filesystem (i.e doesn't work for streams).
• Transcode your MKV/AVI stream on the fly to a supported format. This is pretty flexible but has some serious requirements on your environment, like having ffmpeg (or something similar) installed locally. Good luck packaging that if you want to distribute your app.
• Embed a player capable of MKV/AVI playback. Most common example is VLC Player embedded through node bindings to libvlc. Check out the wcjs-player & wcjs-prebuilt modules if you want to go this way, they are node wrappers for the webchimera.js video player, which uses VLC in the background. (I'm not affiliated with them, just currently using the modules for something similar in one of my projects with success so far.)

I'm sure there are other solutions to this, but these are the most logical ones I've found while researching on the subject. Hope this helps!