HTML5ではWebカメラやマイクにアクセスできます。例えばWebチャットなどで使われたりしますが、ARに使ったりとアイディア次第で面白い使い方が考えられます。録音、録画だって可能です。 今回紹介するMediaStreamRecorderはMediaRecorder APIを使った録音/録画が実装できます。

MediaStreamRecorderの使い方

現在、オーディオ/Webカメラの2パターンが用意されています。

オーディオはWAVファイルが生成されます。

動画はWebMまたはアニメーションGIFで保存できます(動画フォーマットはWebブラウザによります)。

こんなマルチスクリーン化することも。

MediaStreamRecorderを使えばオーディオやWebカメラを使って記録すると言ったことが簡単にできます。Androidでも利用できるので、スマートフォンで録画すると言ったこともできるでしょう。

MediaStreamRecorderはJavaScript製のオープンソース・ソフトウェア(MIT License)です。

MediaStreamRecorder Demos streamproc/MediaStreamRecorder: Cross browser audio/video/screen recording. It supports Chrome, Firefox, Opera and Microsoft Edge. It even works on Android browsers. It follows latest MediaRecorder API standards and provides similar APIs.