react-media-recorder を使用して画面と録画対象のカメラビデオを録画し、それを再生用のビデオに変換したいと考えています。
録画しましたが、表示と再生に 2 つのビデオ要素を使用しました。でも、それらを組み合わせたい。すべての画面録画と同様に、ユーザーのカメラビデオ用のボックスがあります。別の video 要素の上に video 要素を使用しています。
ビデオを結合するには、ビデオ処理を実行する必要があります。ビデオ処理には、ビデオ データを処理し、新しい結合ビデオ映像を作成する一連の手順が含まれます。
たとえば、https://github.com/Kagami/ffmpeg.js/
ただし、フロントエンドでビデオ処理を実行することはお勧めしません。これは、大量のコンピューティング能力を必要とし、バックエンドよりもはるかに遅い可能性があるためです。ただし、この決定は目標と対象ユーザーによって異なります。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
ビデオを結合するには、ビデオ処理を実行する必要があります。ビデオ処理には、ビデオ データを処理し、新しい結合ビデオ映像を作成する一連の手順が含まれます。
たとえば、https://github.com/Kagami/ffmpeg.js/
を使用できます。ただし、フロントエンドでビデオ処理を実行することはお勧めしません。これは、大量のコンピューティング能力を必要とし、バックエンドよりもはるかに遅い可能性があるためです。ただし、この決定は目標と対象ユーザーによって異なります。