Ich versuche, mangels einer anderen Beschreibung einen Offline-Medienkontext zu implementieren.
Das Konzept besteht darin, 1 Sekunde Blob s von aufgezeichneten Medien mit der Fähigkeit
Blobs unabhängig von einem HTMLMediaElement
Blob s Das Problem besteht darin, dass nach dem Verketten der Blob s die Medienressource nicht mit HTMLMedia element unter Verwendung von Blob URL oder MediaSource wiedergegeben wird.
Die erstellte Blob URL spielt nur 1 Sekunde der verketteten Blob 's ab. MediaSource löst zwei Ausnahmen aus
und
%Vor% Wie kann man die verkettete Blob s richtig codieren oder eine Umgehung implementieren, um die Medienfragmente als eine einzelne neu konstituierte Medienressource abzuspielen?
mit Blob URL at else Anweisung bei select change Ereignis, das nur die erste Sekunde der Medienressource spielt
plnkr Version Version 1 Blob URL , Version 2 MediaSource
Derzeit gibt es keine Web-API für die Videobearbeitung.
Die MediaStream- und MediaRecorder-APIs sollen sich mit Live-Quellen befassen.
Aufgrund der Struktur von Videodateien können Sie nicht nur einen Teil davon abschneiden, um ein neues Video zu erstellen, noch können Sie kleine Videodateien verketten, um einen längeren zu erstellen. In beiden Fällen müssen Sie die Metadaten neu erstellen, um eine neue Videodatei zu erstellen.
Die einzige aktuelle API, die MediaFiles erzeugen kann, ist der MediaRecorder.
Derzeit gibt es nur zwei Implementationen der MediaRecorder API, aber sie unterstützen ungefähr 3 verschiedene Codecs in zwei verschiedenen Containern, was bedeutet, dass Sie mindestens 5 Metadaten-Parser erstellen müssen, um nur aktuelle Implementierungen zu unterstützen (die beibehalten werden) wachsender Anzahl, und die aktualisiert werden müssen, wie die Implementierungen aktualisiert werden.
Klingt wie ein harter Job.
Vielleicht erlaubt uns die eingehende WebAssembly-API, ffmpeg in Browser zu portieren, was es viel einfacher machen würde, aber ich muss zugeben, dass ich WA überhaupt nicht kenne, also bin ich mir nicht einmal sicher, ob es wirklich machbar ist .
Ich höre Sie sagen: "Ok, dafür gibt es kein Tool, aber wir sind Hacker, und wir haben andere Werkzeuge mit großer Macht."
Nun ja. Wenn wir wirklich dazu bereit sind, können wir etwas hacken ...
Wie bereits erwähnt, sind MediaStream und MediaRecorder für Live-Video gedacht. Wir können also statische Videodateien mit den Methoden [HTMLVideoElement | HTMLCanvasElement].captureStream() in Livestreams konvertieren.
Wir können diese Live-Streams dank der MediaRecorder API auch in einer statischen Datei aufzeichnen.
Es ist jedoch nicht möglich, die aktuelle Stream-Quelle, mit der ein MediaRecorder gespeist wird, zu ändern.
Um kleine Videodateien zu einem längeren zusammenzuführen, müssen wir also
<video> elements <video> -Elemente in einem <canvas> -Element in der gewünschten Reihenfolge <video> -Elemente Aber das bedeutet, dass die Zusammenführung eigentlich eine Neuaufnahme aller Videos ist, und dies kann nur in Echtzeit (Geschwindigkeit = x1) erfolgen
Hier ist ein Live Proof of Concept, bei dem wir zuerst eine originale Videodatei in mehrere kleinere Teile zerlegen, diese Teile mischen, um etwas Montage zu imitieren, dann einen leinwandbasierten Player erstellen, der diese Montage auch aufnehmen und exportieren kann.
NotaBene: Dies ist die erste Version, und ich habe immer noch eine Menge Bugs (notabene in Firefox, sollte fast in Chrom funktionieren).
Tags und Links javascript codec media media-source bloburls