Обновление 2020/9: измените структуру абзацев, чтобы сделать их более читаемыми.

Предыдущая статья: Сборка версии FFmpeg WebAssembly (= ffmpeg.wasm): Часть 3 ffmpeg.wasm v0.1 - Транскодирование avi в mp4

В этой части вы узнаете:

  1. Добавьте Libx264 в ffmpeg-core.js
  2. В браузере демо ffmpeg.wasm

Добавьте Libx264 в ffmpeg-core.js

На следующем этапе мы хотели бы перекодировать avi-видео и воспроизвести его в нашем веб-браузере. По умолчанию ffmpeg-core.js может перекодировать avi в mp4, но этот файл mp4 нельзя воспроизвести в веб-браузере, поскольку его кодировка не поддерживается. Итак, нам нужно сначала добавить libx264 в наш ffmpeg-core.js.

Ниже приведена ссылка на библиотеку x264, которую мы собираемся добавить:



x264 намного проще построить по сравнению с ffmpeg, ниже приведены ключевые аргументы, которые вам необходимо передать:

Проверить репозиторий на наличие полной версии build-x264.sh

При настройке ffmpeg необходимо добавить флаги --enable-gpl и --enable-libx264.

Проверьте репозиторий на наличие полной версии configure.sh и build-ffmpeg.sh

Имея все сценарии, теперь вы можете создать ffmpeg.wasm с x264 (и, возможно, со всеми другими библиотеками).

В браузере демо ffmpeg.wasm

Заключительная часть этой истории - это демонстрация для ffmpeg.wasm v0.2.2, сценарий заключается в создании веб-страницы, которая позволяет пользователю загружать видеофайл (например, avi) и воспроизводить его в веб-браузере. Поскольку напрямую воспроизвести avi-файл невозможно, мы сначала воспользуемся ffmpeg.wasm для перекодирования видео:

Ниже представлен полный HTML-код (скачать образец видео ЗДЕСЬ):

Это может занять много времени, вы можете открыть DevTools, чтобы просмотреть журналы. Проверьте transcode.html, чтобы увидеть, как он работает в действии.

Вы можете посетить репозиторий здесь, чтобы подробнее узнать, как это работает: https://github.com/ffmpegwasm/FFmpeg/tree/n4.3.1-p4

И не стесняйтесь загружать артефакты сборки здесь: https://github.com/ffmpegwasm/FFmpeg/releases/tag/n4.3.1-p4

Сделаем паузу в этой серии рассказов, надеюсь, вы узнали, как создать свой собственный ffmpeg.wasm с нуля и, возможно, применить его к любым другим библиотекам. Увидимся в следующий раз! 😃