Home  >  Article  >  Web Front-end  >  recorder.js implements recording function based on HTML5

recorder.js implements recording function based on HTML5

Guanhui
Guanhuiforward
2020-06-23 18:04:384297browse

recorder.js implements recording function based on HTML5

recorder.js

microphone is based on HTML5 recording function, and the output format is mp3 file.

Preface

Completely dependent on H5 native API
Involved APIs: WebRTC, AudioContext, Worker, Video/Audio API, Blob, URL

Compatibility

  • ##Chrome, FF, Edge, QQ, 360 (Note: Currently all versions of IE and Safari are not compatible)

  • Among them, Chrome 47 and above and QQ browser mandatory require HTTPS support

  • Please try to use FF, Edge, 360 and other browsers to experience it, or download the project locally and pass it through Localhost method

Usage method

var recorder = new Recorder({
    sampleRate: 44100, //采样频率,默认为44100Hz(标准MP3采样率)
    bitRate: 128, //比特率,默认为128kbps(标准MP3质量)
    success: function(){ //成功回调函数
    },
    error: function(msg){ //失败回调函数
    },
    fix: function(msg){ //不支持H5录音回调函数
    }
});

API

//开始录音
recorder.start();
//停止录音
recorder.stop();
//获取MP3编码的Blob格式音频文件
recorder.getBlob(function(blob){ //获取成功回调函数,blob即为音频文件
//  ...
},function(msg){ //获取失败回调函数,msg为错误信息
//  ...
});

Recommended tutorial: "

HTML Tutorial 》《JS tutorial

The above is the detailed content of recorder.js implements recording function based on HTML5. For more information, please follow other related articles on the PHP Chinese website!

Statement:
This article is reproduced at:jb51.net. If there is any infringement, please contact admin@php.cn delete