第10章 函数与方法

在本章中,我们将详细介绍RecordRTC提供的核心函数和方法,帮助您更好地掌握这个库的使用。

10.1 核心构造函数

RecordRTC的核心构造函数用于创建录制器实例:

RecordRTC构造函数

// RecordRTC构造函数
var recorder = RecordRTC(mediaStream, options);

// 参数说明:
// mediaStream: MediaStream对象,来自getUserMedia或getDisplayMedia
// options: 配置对象,包含录制参数

// 示例:
navigator.mediaDevices.getUserMedia({ video: true, audio: true })
    .then(function(stream) {
        var recorder = RecordRTC(stream, {
            type: 'video',
            mimeType: 'video/webm'
        });
        
        // 保存实例供后续使用
        window.recorder = recorder;
    });

10.2 录制控制方法

控制录制过程的核心方法:

录制控制方法

// 开始录制
recorder.startRecording();

// 暂停录制
recorder.pauseRecording();

// 恢复录制
recorder.resumeRecording();

// 停止录制
recorder.stopRecording(function() {
    // 停止后的回调函数
    var blob = recorder.getBlob();
    console.log('录制完成,获取到blob对象');
});

// 获取录制状态
var state = recorder.getState();
// 返回值: 'inactive', 'recording', 'paused', 'stopped'

// 销毁录制器
recorder.destroy();

10.3 数据获取方法

获取录制数据的相关方法:

数据获取方法

// 获取录制的Blob对象
var blob = recorder.getBlob();

// 获取录制的URI
var uri = recorder.toURL();

// 获取录制的缓冲区数据
recorder.getBuffer(function(buffer) {
    // buffer包含录制的原始数据
    console.log('缓冲区数据:', buffer);
});

// 获取录制的数组缓冲区
recorder.getArrayBuffer(function(arrayBuffer) {
    // arrayBuffer包含二进制数据
    console.log('数组缓冲区数据:', arrayBuffer);
});

// 保存为文件对话框
RecordRTC.invokeSaveAsDialog(blob, 'my-recording.webm');

// 保存为数据URL
var dataURL = recorder.getDataURL(function(dataURL) {
    console.log('数据URL:', dataURL);
});

10.4 静态工具方法

RecordRTC提供的静态工具方法:

静态工具方法

// 检查浏览器支持
var isSupported = RecordRTC.isRecordingSupported();
console.log('浏览器是否支持录制:', isSupported);

// 获取录制器类型
var recorderType = RecordRTC.getFromDisk('all');
console.log('可用的录制器类型:', recorderType);

// 设置调试模式
RecordRTC.debug = true; // 启用调试日志

// 设置默认配置
RecordRTC.setDefaultOptions({
    type: 'video',
    mimeType: 'video/webm'
});

// 从磁盘获取数据
RecordRTC.getFromDisk('video', function(data) {
    console.log('从磁盘获取的视频数据:', data);
});

// 清除磁盘数据
RecordRTC.clearRecordedData();

// 转换为音频上下文
RecordRTC.convertToAudioContext(blob, function(audioContext) {
    console.log('转换为音频上下文:', audioContext);
});

10.5 录制器类型方法

不同录制器类型的特定方法:

录制器类型方法

// StereoAudioRecorder特定方法
var audioRecorder = RecordRTC(stream, {
    type: 'audio',
    recorderType: StereoAudioRecorder
});

// MediaStreamRecorder特定方法
var mediaRecorder = RecordRTC(stream, {
    type: 'video',
    recorderType: MediaStreamRecorder
});

// GifRecorder特定方法
var gifRecorder = RecordRTC(stream, {
    type: 'gif',
    recorderType: GifRecorder
});

// CanvasRecorder特定方法
var canvasRecorder = RecordRTC(canvasStream, {
    type: 'canvas',
    recorderType: CanvasRecorder
});

// WhamRecorder特定方法
var whamRecorder = RecordRTC(stream, {
    type: 'video',
    recorderType: WhamRecorder
});

10.6 高级方法

一些高级功能方法:

高级方法

// 设置录制时间限制
recorder.setRecordingDuration(30000, function() {
    // 30秒后自动停止
    console.log('录制时间到达限制');
});

// 初始化视频预览
RecordRTC.initVideoPreview(videoElement, stream);

// 初始化音频预览
RecordRTC.initAudioPreview(audioElement, stream);

// 检查MIME类型支持
var isSupported = RecordRTC.canRecordingType('video/webm');
console.log('MIME类型支持情况:', isSupported);

// 获取浏览器信息
var browserInfo = RecordRTC.browser;
console.log('浏览器信息:', browserInfo);

// 设置自定义前缀
RecordRTC.prefix = 'myapp_';

// 获取录制的文件名
var filename = recorder.getFileName();
console.log('录制文件名:', filename);

// 设置录制的文件名
recorder.setFileName('custom-name.webm');

10.7 错误处理方法

处理录制过程中可能出现的错误:

错误处理方法

// 设置错误处理回调
recorder.onerror = function(error) {
    console.error('录制过程中发生错误:', error);
};

// 检查录制支持情况
if (!RecordRTC.isRecordingSupported()) {
    console.warn('当前浏览器不支持录制功能');
    // 提供替代方案
    showAlternativeSolution();
}

// 处理特定录制器错误
try {
    var recorder = RecordRTC(stream, options);
    recorder.startRecording();
} catch (error) {
    console.error('初始化录制器失败:', error);
    handleRecorderError(error);
}

// 自定义错误处理函数
function handleRecorderError(error) {
    switch (error.name) {
        case 'SecurityError':
            alert('安全错误:请检查HTTPS设置');
            break;
        case 'NotSupportedError':
            alert('不支持错误:浏览器版本过低');
            break;
        case 'InvalidStateError':
            alert('状态错误:录制器状态异常');
            break;
        default:
            alert('未知错误:' + error.message);
    }
}