Wie implementiere ich einen Frontend-Media-Player mit hoher Kompatibilität?

[Kokujou]

Hi Leute!

Aktuell greife ich im Frontend auf Dateien im lokalen Dateisystem zu indem ich mir mit etwas trickserei den Pfad vom User geben lasse und diesen an ein Backend sende. Das Backend holt sich die Datei und sendet sie ans Frontend...

nun das Problem: Firefox ist nicht MKV-tauglich! und sicherlich ist das nur eines der vielen Hindernisse...

Die Frage ist also erstmal: Ist es überhaupt möglich einen hoch-kompatiblen Media-Player im Frontend zu basteln der mit allen gängigen Media-Types kompatibel ist?
Und das, ganz wichtig: Ohne eine Kopie der Datei zu machen! (meine Media Files gehen gerne mal in den GB bereich, es wäre schrecklich jedes davon zu kopieren, meine Festplatte würde explodieren!)
und wenn ja, wie?

 

[Bagbag]

Ich gehe mal davon aus, dass du im Browser abspielen meinst?

Nein, der Support ist vom Browser abhängig. Wenn der kein mkv kann, kann er kein mkv.

Maximale Kompatiblität erreichst du wohl mit mp4. Anstatt alles doppelt und 3-fach vorzuhalten, könntest du es mit bspw. ffmpeg einfach zu mp4 Konvertieren (ffmpeg -i video.mkv -c:a copy -c:v copy out.mp4) und die mkv löschen.

Alternativ könntest du diese Konvertierung bei jedem Abrufen der Datei machen, wenn du es bei mkv auf der Platte belassen willst. Hier dann natürlich nicht in eine Datei, sondern direkt an den Client streamen. Da hier die Video und Audio Streams kopiert und nicht neu kodiert (-c:* copy) werden, benötigt das ganze kaum Leistung.

 

[blackbirdone]

Da dir die Codecs fehlen nein. MKV ist halt ein Standart Raupkopie Format. Das kaum jemand wirklich unterstützt.
Frag mich wieso du nicht einfach VLC nutzt ohne Webseite aber gut.

Deshalb verwenden so gut wie alle Dienste Standart Formate für alle ihre Filme. Dann einfach den HTML5 Player nutzen und fertig. Also entweder on the fly codieren wenn das dir reicht oder schon fertig auf Platte liegen haben.

Ps wieso nicht Kodi oder Plex da ist doch schon alles fertig gebaut

 

[BlubbsDE]

MKV ist kein Format. Das ist ein Container wo zu 99.9 % h.264 oder bei aktuellen herunter geladenen BDs auch h.265 drin steckt. Das kann jeder Browser.

 

[motorazrv3]

Er könnte auch simples umbenennen der Datei versuchen. Also statt .mkv dann .mp4.
Viele Ausgabegeräte können damit dann schon umgehen.

 

[Bagbag]

@BlubbsDE ein Containerformat? Es ist kein Codec, aber ein Format schon.

 

[motorazrv3]

MKV ist kein Format.

Genau, das ist ein sogenannter Container für verschiedenste Dateien.
https://de.wikipedia.org/wiki/Matroska

 

[madmax2010]

@Bagbag @BlubbsDE hat recht. Und auch ein Containerformat ist ein Format
Allgemein haben dateiendungen nur unter Windows wirklich relevanz - Browser schauen da eher auf den Header als auf den Namen.

 

[DeusoftheWired]

Aktuell greife ich im Frontend auf Dateien im lokalen Dateisystem zu indem ich mir mit etwas trickserei den Pfad vom User geben lasse und diesen an ein Backend sende. Das Backend holt sich die Datei und sendet sie ans Frontend...

Kannst du etwas zum Hintergrund ausholen? Nicht daß wir hier an ’nem XY-Problem rumwerkeln.

Liegen deine Dateien lokal auf dem Gerät oder entfernt im Netzwerk?
Weshalb die Wiedergabe über einen Browser und nicht über einen dedizierten Abspieler wie MPC-HC, mplayer, MPV, VLC etc.?

 

[Bagbag]

@madmax2010 sag ich doch? Es ist ein Format.

 

[Kokujou]

Das "On the fly" kopieren wäre eine Idee... hat jemand einen Link für mich parat? dann könnte ich das probieren...

tatsächlich hab ich bei dem MVC controller einfach mal das MKV file mit video/webm als content-type zurückgegeben und als *.webm zurückgegeben, konnte er aber auch nicht leiden... aber ich kann es mal mit mp4 probieren... oder wäre der MVC Controller da zu spät sodass man es wirklich auf dem Dateisystem umbenennen müsste?

Die Dateien gebe ich im Browser wieder, weil das "datei vom lokalen system wiedergeben" nur ein Mock sein soll. Ich bau mir ne Frontend Datenbank für Filme und Serien die ich aktuell habe mit coolem Streaming Feature. Ich möchte möglichst nah an der Realität bleiben, also tun wir einfach so als wären die Datei irgendwo im Netzwerk^^

Aber selbst ohne Streaming Feature... wie ich aus dem vorherigen Thread weiß stellt sich javascript tierisch an bei lokalem dateisystem, also einen link auf ein Media-File im lokalen system als würde ich drauf doppelklicken krieg ich vermutlich mit vanilla JS nicht hin.

 

[DeusoftheWired]

Ich bau mir ne Frontend Datenbank für Filme und Serien die ich aktuell habe mit coolem Streaming Feature.

Also am Ende etwas in Richtung von Kodi bzw. Plex? Wenn du’s aus Spaß an der Freude oder zum Lernen entwickeln willst, laß dich nicht abhalten. Ein Muß ist es aber nicht; da gibt’s mit Kodi was gutes Etabliertes.

 

[Kokujou]

Also am Ende etwas in Richtung von Kodi bzw. Plex? Wenn du’s aus Spaß an der Freude oder zum Lernen entwickeln willst, laß dich nicht abhalten. Ein Muß ist es aber nicht; da gibt’s mit Kodi was gutes Etabliertes.

ja genau einfach ein schönes Projekt zum Lernen und zum coden wenn auf Arbeit mal wieder nix zutun ist... erste Welt Probleme

darum... ich brauch jetzt halt irgendeine Lösung um meine Videos auch auf firefox anzeigen zu können... das heißt ich versuche morgen, wenn Zeit ist:
ffmpeg - on the fly kodierung auf MP4
und die files auf dem MVC controller einfach auf MP4 umbenennen. ist ja hoffentlich dasselbe nur ohne die datei zu verändern.

 

[Bagbag]

Nein, Datei umbenennen ändert genau nichts am Format und/oder Codec.

 

[Kokujou]

Nein, Datei umbenennen ändert genau nichts am Format und/oder Codec.

Er könnte auch simples umbenennen der Datei versuchen. Also statt .mkv dann .mp4.
Viele Ausgabegeräte können damit dann schon umgehen.

 

[Bagbag]

Das ändert nichts an meiner Aussage und macht sie nicht weniger wahr.

Wenn du irgendwo versuchst eine mkv abzuspielen, kann es sein, dass es einfach wegen der Dateiendung abgelehnt wird. Passt du es zu mp4 an, kann man die Datei "starten". Das Lesen des Containers und Dekodieren der Streams wird aber nicht anhand der Dateiendung bestimmt, sondern anhand der Magic Bytes (https://en.wikipedia.org/wiki/List_of_file_signatures). Sind dafür passende Dekoder vorhanden, geht es. Da kannst du die Datei auch mit .xyz enden lassen oder die Endung ganz entfernen. Und der Inhalt der Datei ändert sich eben nicht durch umbenennen, sondern nur der Name.

 

[Kokujou]

okay dann probier ich es mit on-the-fly kodierung.

 

[Kokujou]

okay also ich bin jetzt soweit dass ich den stream "on the fly" kopiere... allerdings dauert der Request jetzt ne halbe Ewigkeit, das geht so natürlich nicht...

wie bau ich denn jetzt sowas wie buffering? ich benutze FFMpegCore für C#. es gibt den Stream ja asynchron zurück... aber das HTML video lädt nicht ich schätze das läuft erst wenn der Vorgang fertig ist, ich hätte aber gerne das er schonmal das video anzeigt während in den ausgabe-stream geschrieben wird...

 

[Bagbag]

Du musst es auch streamen und nicht komplett konvertieren und dann senden. Das ist also kein on-the-fly.
Hier fehlt uns jetzt wohl Code.

Oder was auch sein könnte ist, dass du mp4 streambar machen musst. Da gibts glaub irgendein Modus, bei dem die Header erst am Ende geschrieben werden.

 

[Kokujou]

[HttpGet]
        public async Task<IActionResult> GetFile(string filePath = "")
        {
            if (string.IsNullOrEmpty(filePath)) return BadRequest("invalid file path");

            GlobalFFOptions.Configure(options => options.BinaryFolder = "D:\\Programme\\ffmpeg\\bin");

            Response.ContentType = "video/mp4";
            await FFMpegArguments.FromFileInput(new FileInfo(filePath)).OutputToPipe(
                new StreamPipeSink(Response.Body),
                options =>
                    options.WithVideoCodec("h264").ForceFormat(VideoType.MpegTs)).ProcessAsynchronously();

            return Ok();
        }

so versuche ich es aktuell... klappt nur leider nicht. im Network tab ist nur ein request der nicht fertig gestellt wird und das video lädtund lädt und am ende kommt nur wieder dass der mime type nicht stimmt

außerdem javascript:

<video controls>
                    <source
                        type="video/webm"
                        src="https://localhost/ObscuritasMediaManager/api/file?filePath=H:\\Realfilmserien\\Anger Management\\Staffel 2\\Anger.Management.S02E02.Charlies.Papa.hat.gesagt.German.DL.1080p.BluRay.x264-RSG.mkv"
                    />
                </video>