Примечание.
Эта статья также доступна здесь. (Японский)
https://cloud.flect.co.jp/entry/2020/12/29/152543

Вступление

Amazon Chime SDK JS версии 2.3.0 был выпущен 21 декабря 2020 года.
В этом выпуске была добавлена ​​новая замечательная функция - API обработки видео!

Https://github.com/aws/amazon-chime-sdk-js/blob/master/CHANGELOG.md

API-интерфейсы обработки видео - это API-интерфейсы, которые позволяют редактировать видео (кадры) вашей собственной камеры во время видеоконференцсвязи перед его передачей. Его можно использовать, например, для создания виртуального фона, который размывает фон камеры.

Судя по официальной документации, способ достижения этого кажется похожим на способ, который я представил ранее. Наконец-то официально! У меня такое чувство. Я взволнован.

Теперь давайте попробуем создать виртуальный фон с помощью Video Processing API.

Как использовать API обработки видео

Как описано в документации, API обработки видео редактируют видео путем конвейерной обработки кадров устройства ввода через один или несколько процессоров VideoFrameProcessor. API обработки видео предоставляет класс (интерфейс) VideoTransformDevice, который обертывает эту конвейерную обработку. Итак, создайте экземпляр этого класса, передав устройство ввода и массив VideoFrameProcessors его конструктору.

Этот экземпляр VideoTransformDevice можно передать Amazon Chime в качестве виртуального устройства ввода видео, поэтому передайте его Amazon Chime с помощью chooseVideoInputDevice.

То есть мы можем создать экземпляр, как показано ниже.

const transformDevice = new DefaultVideoTransformDevice(
    logger,
    deviceId, 
    [new SomeVideoFrameProcessorA(), ...]  // VideoFrameProcessor implements editing function
);

И сделайте meetingSession.audioVideo.chooseVideoInputDevice(transformDevice) вместо meetingSession.audioVideo.chooseVideoInputDevice(deviceId)

На этот раз мы создадим один VideoFrameProcessor, который заменяет фон другим изображением для достижения функциональности виртуального фона. Вот как создать VideoTransformDevice.

const transformDevice = new DefaultVideoTransformDevice(
    logger,
    deviceId, 
    [new VirtualBackground()]  // VideoFrameProcessor implements virtual background
);

VideoFrameProcessor для виртуального фона

VideoFrameProcessor - это класс (интерфейс) с методом обработки, который обрабатывает изображения кадров. Содержимое этого метода процесса идентифицирует человека и фон и заменяет фон другим изображением. Чтобы идентифицировать человека и фон, мы используем Bodypix, как описано в предыдущей статье.

Метод процесса получает массив данных кадра (VideoFrameBuffer) в качестве аргумента, поэтому он извлекает отсюда данные изображения и обрабатывает их. Это выглядит примерно так.

async process(buffers: VideoFrameBuffer[]){
        for(const f of buffers){
            const canvas = f.asCanvasElement() // extract image data
            // (1)edit image
        }
        return Promise.resolve(buffers)
    }

В части редактирования изображения (1) приведенного выше исходного кода bodypix используется для идентификации человека и фона и замены фона. Конкретный процесс описан в предыдущей статье, поэтому здесь он не приводится.

Это все, что нужно сделать. Какая легкость!

Запустить его!

Теперь посмотрим, как это работает. Фон был заменен изображением.

Репозиторий

Исходный код этого проекта можно найти в следующем репозитории.



Пожалуйста, обратитесь к README репозитория, чтобы узнать, как это работает.

Резюме

Вот как мы реализовали виртуальный фон с помощью новых API обработки видео в Amazon Chime SDK. Это довольно легко реализовать, и мы смогли опустить довольно много частей, которые пытались реализовать в прошлом. Это очень сложное ощущение, но, поскольку техническое обслуживание является официальным, это полное благо.

В репозитории ниже мы выпустили версию с функциями чата и интерактивной доски в дополнение к функциям, представленным здесь.
Также была реализована интеграция с Cognito. Взгляните на репозиторий ниже.



Благодарности

Видео в тексте взято с этого сайта.

Https://pixabay.com/ja/videos/