MediaRecorder()
コンストラクタは、指定された MediaStream
を記録する新しい MediaRecorder
オブジェクトを作成します。
構文
var mediaRecorder = new MediaRecorder(stream[, options]);
パラメータ
stream
- 記録される
MediaStream
。 このソースメディアは、navigator.mediaDevices.getUserMedia()
を使用して作成したストリーム、または<audio>
、<video>
、<canvas>
要素から取得できます。 -
options
Optional -
以下のプロパティを含むことができる辞書オブジェクト。
mimeType
: 新しいMediaRecorder
の記録コンテナとして使用する MIME タイプ。アプリは、MediaRecorder.isTypeSupported()
を呼び出すことによって、このmimeType
がユーザーエージェントによってサポートされているかどうかを事前に確認できます。audioBitsPerSecond
: メディアの音声コンポーネントに選択したビットレート。videoBitsPerSecond
: メディアの動画コンポーネントに選択したビットレート。bitsPerSecond
: メディアの音声コンポーネントおよび動画コンポーネントに選択したビットレート。 上記の2つのプロパティの代わりにこれを指定できます。 これを上記のプロパティのいずれかと一緒に指定している場合、これは指定していないものに使用されます。
動画や音声にビット/秒の値を指定していない場合、動画が採用しているデフォルトは 2.5Mbps ですが、音声のデフォルトはサンプルレートとチャネル数に応じてアダプティブです。
例
この例では、音声のビットレートを 128 Kビット/秒に設定し、動画のビットレートを 2.5 Mビット/秒に設定して、指定したストリーム用のメディアレコーダーを作成する方法を示します。 記録したメディアデータは MP4 ラッパーに保存されます(従って、メディアデータのチャンクを集めてディスクに保存すると、それらは MP4 ファイルになります)。
...
if (navigator.mediaDevices.getUserMedia) {
var constraints = { audio: true, video: true };
var chunks = [];
var onSuccess = function(stream) {
var options = {
audioBitsPerSecond : 128000,
videoBitsPerSecond : 2500000,
mimeType : 'video/mp4'
}
var mediaRecorder = new MediaRecorder(stream,options);
m = mediaRecorder;
...
仕様
仕様 | 状態 | コメント |
---|---|---|
MediaStream Recording | 草案 | 初期定義 |
ブラウザーの互換性
The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
デスクトップ | モバイル | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
MediaRecorder() constructor | Chrome 完全対応 47 | Edge 未対応 なし | Firefox 完全対応 25 | IE ? | Opera 完全対応 36 | Safari ? | WebView Android 完全対応 47 | Chrome Android 完全対応 47 | Firefox Android 完全対応 25 | Opera Android 完全対応 36 | Safari iOS ? | Samsung Internet Android 完全対応 5.0 |
options object | Chrome 完全対応 49 | Edge 未対応 なし | Firefox 完全対応 43 | IE ? | Opera 完全対応 36 | Safari ? | WebView Android 完全対応 49 | Chrome Android 完全対応 49 | Firefox Android ? | Opera Android 完全対応 36 | Safari iOS ? | Samsung Internet Android 未対応 なし |
凡例
- 完全対応
- 完全対応
- 未対応
- 未対応
- 実装状況不明
- 実装状況不明
関連情報
- MediaStream Recording API の使用
- ウェブディクタフォン: MediaRecorder + getUserMedia + Web Audio API 可視化デモ、Chris Mills 著(Github のソース)。(英語)
- simpl.info の MediaStream Recording のデモ、Sam Dutton 著。(英語)
navigator.mediaDevices.getUserMedia()