学会这些 API，轻松开发 UniApp 音视频功能

UniApp 音频与视频处理详解

UniApp 提供了一系列强大的 API，用于音频与视频的录制、播放和管理。这些 API 能够帮助开发者快速实现多媒体功能，适用于聊天工具、音乐播放器、短视频应用等场景。本文详细介绍音频与视频相关 API 的作用、参数及示例代码。

---

一、音频处理

1. 录音功能（RecorderManager）

RecorderManager 是 UniApp 提供的录音管理器，用于控制录音的开始、暂停、停止等操作。

常用方法

方法	说明
start(options)	开始录音，传入配置参数。
stop()	停止录音，触发 onStop 回调，返回录音文件路径。
pause()	暂停录音。
resume()	恢复录音。
onStart()	监听录音开始事件。
onStop()	监听录音停止事件，返回录音结果（tempFilePath）。
onPause()	监听录音暂停事件。
onResume()	监听录音恢复事件。
onError()	监听录音错误事件。

配置参数（start 方法）

参数	类型	默认值	说明
duration	Number	60000	最大录音时长（毫秒）。
sampleRate	Number	8000	采样率，可选值：8000、16000、44100。
numberOfChannels	Number	1	声道数，1 表示单声道，2 表示双声道。
encodeBitRate	Number	24000	编码码率。
format	String	aac	音频格式，可选值：aac 或 mp3。

示例代码

const recorderManager = uni.getRecorderManager();

// 开始录音
function startRecording() {
    recorderManager.start({
        duration: 10000, // 最长10秒
        format: 'mp3',   // 音频格式
    });
    console.log("录音开始");
}

// 停止录音
recorderManager.onStop((res) => {
    console.log('录音停止:', res.tempFilePath); // 返回录音文件路径
});

// 错误处理
recorderManager.onError((err) => {
    console.log('录音错误:', err);
});

---

2. 播放音频功能（BackgroundAudioManager & InnerAudioContext）

（1）BackgroundAudioManager

适用于需要后台播放的场景，如音乐播放器。

常用方法

方法	说明
play()	播放音频。
pause()	暂停播放音频。
stop()	停止播放音频。
seek(time)	跳转到指定时间点播放。

属性说明

属性	类型	说明
src	String	音频资源路径，必填。
title	String	音频标题。
epname	String	专辑名称。
singer	String	歌手名称。
coverImgUrl	String	音频封面图 URL。

示例代码

const backgroundAudioManager = uni.getBackgroundAudioManager();

backgroundAudioManager.src = 'https://example.com/song.mp3';
backgroundAudioManager.title = '背景音乐';
backgroundAudioManager.epname = '专辑名';
backgroundAudioManager.singer = '歌手名';

// 播放
backgroundAudioManager.play();

// 暂停
backgroundAudioManager.pause();

（2）InnerAudioContext

适用于短音频播放，如提示音。

示例代码

const audioContext = uni.createInnerAudioContext();
audioContext.src = 'https://example.com/sound.mp3';
audioContext.onPlay(() => console.log('音频播放开始'));
audioContext.onError((err) => console.log('音频播放错误:', err));

// 播放
audioContext.play();

---

二、视频处理

1. 录制视频（chooseVideo）

chooseVideo 是一个简单的方法，用于调用系统摄像头录制视频或从相册选择视频。

参数说明

参数	类型	默认值	说明
sourceType	Array	['album', 'camera']	视频来源：相册或摄像头。
maxDuration	Number	60	视频最大录制时长（秒）。
camera	String	back	使用后置或前置摄像头。
compressed	Boolean	true	是否压缩视频文件。

示例代码

uni.chooseVideo({
    sourceType: ['camera'], // 从摄像头录制
    maxDuration: 30,        // 最长30秒
    success: (res) => {
        console.log('录制成功，视频路径:', res.tempFilePath);
    },
    fail: (err) => {
        console.log('录制失败:', err);
    }
});

---

2. 播放视频（video组件 & createVideoContext）

（1）video 组件

video 组件用于页面直接嵌入视频播放。

示例代码

<template>
    <view>
        <video 
            id="myVideo"
            src="https://example.com/video.mp4"
            controls
            autoplay
            style="width: 100%; height: 300px;">
        </video>
    </view>
</template>

（2）createVideoContext

用于操作页面的 video 组件，提供控制视频播放的功能。

常用方法

方法	说明
play()	播放视频。
pause()	暂停视频。
seek(time)	跳转到指定时间点播放。

示例代码

const videoContext = uni.createVideoContext('myVideo');

// 播放
videoContext.play();

// 暂停
videoContext.pause();

---

3. 选择本地视频（chooseVideo）

chooseVideo 方法也可以用于从相册中选择视频。

示例代码

uni.chooseVideo({
    sourceType: ['album'], // 从相册选择
    success: (res) => {
        console.log('选择的视频路径:', res.tempFilePath);
    },
    fail: (err) => {
        console.log('选择失败:', err);
    }
});

---

总结

UniApp 提供了灵活的音频与视频处理功能：

• 录音功能 使用 RecorderManager 实现。
• 音频播放 支持后台播放（BackgroundAudioManager）和短音频播放（InnerAudioContext）。
• 视频处理 提供了录制（chooseVideo）、播放（video组件和createVideoContext）以及选择本地视频等能力。

合理使用这些 API，可以快速开发聊天工具、音乐播放器或短视频应用等多媒体功能。