🚀 新規事業
audio-recorder
最終更新 2026年05月09日 / 40_新規事業/SCALE_Build/カタログ/機能集/audio-recorder.md
音声録音(MediaRecorder)
用途
ブラウザで音声録音 → Blobで保存・送信。議事録・音声メモに。
特徴
- 録音/停止
- リアルタイム波形表示
- Blob出力
- WAV変換
コード(コピペ用)
export class AudioRecorder {
private recorder: MediaRecorder | null = null;
private chunks: Blob[] = [];
async start() {
const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
this.recorder = new MediaRecorder(stream);
this.chunks = [];
this.recorder.ondataavailable = (e) => this.chunks.push(e.data);
this.recorder.start();
}
stop(): Promise<Blob> {
return new Promise(resolve => {
this.recorder!.onstop = () => {
resolve(new Blob(this.chunks, { type: 'audio/webm' }));
this.recorder!.stream.getTracks().forEach(t => t.stop());
};
this.recorder!.stop();
});
}
}
使い方
対象プロジェクトに該当ファイルをコピーして、props を流し込むだけ。
注意事項
- 依存パッケージを忘れず追加