实现 3D 空间音频

实现 3D 空间音频

功能简介

在社交元宇宙等场景下,用户在通过简单语音交流外,结合场景也需要一些立体声效果来让用户感知游戏角色周围其他用户的存在及其对应的距离和方位,提高语音通话的趣味性。 本文将介绍在如何在开发 TRTC 应用中开启 3D 空间音频功能。

前提条件

平台 Win Android iOS Mac
支持 ✅Chrome 86+ ✅Chrome 86+ ✅Chrome 86+

实现流程

你可以参考文档 开始集成音视频通话 来实现音视频通话。

加载 SDK

因为空间音频功能不是所有应用都需要,所以我们在 node_modules/trtc-sdk-v5 目录下增加了一个 trtc-spatial.js 用于专门实现 3D 空间音频。

// 当您的应用不需要空间音频时
import TRTC from 'trtc-sdk-v5';
// 当您的应用需要空间音频时
import TRTC from 'trtc-sdk-v5/trtc-spatial.js';

实现

// 创建 client
const client = TRTC.create({ mode: 'rtc', sdkAppId, userId, userSig });
const { detail } = await TRTC.checkSystemRequirements();
// 如果你需要使用空间音频,你应该在加入房间前启用它。
if (detail.isSpatialAudioSupported) {
  client.enable3DSpatialAudioEffect(true);
}
// 加入房间
await client.join({ roomId: 8888 });
// 如果有远端用户加入,你会收到事件通知。
client.on('stream-added', event => {
  const remoteStream = event.stream;
  console.log('New remote stream:' + remoteStream.getId());
  // 订阅到远端流
  client.subscribe(remoteStream);
});
client.on('stream-subscribed', event => {
  const remoteStream = event.stream;
  console.log('成功订阅了远程流:' + remoteStream.getId());
  // 播放远端流
  remoteStream.play('remote_stream-' + remoteStream.getId());
});
// 当你成功订阅了一个用户,你可以实时更新他们的位置信息。
client.updateRemote3DSpatialPosition('tom', [100, 200, 0]);
// 你同时也可以更新自己的位置信息
client.updateSelf3DSpatialPosition([100, 0, 0], [2, 1, 0], [-1, 2, 0], [0, 0, 1]);

API

Client.enable3DSpatialAudioEffect(enabled): void

启用3D空间音频效果。

如果你需要使用空间音频,你应该在加入房间之前启用它。

例子:

// 开启 3D 音频效果
// Good:
client.enable3DSpatialAudioEffect(true);
await client.join({ roomId: 8888 });
// Bad:
await client.join({ roomId: 8888 });
client.enable3DSpatialAudioEffect(true);
client.enable3DSpatialAudioEffect(false);

Client.updateSelf3DSpatialPosition(position, axisRight, axisForward, axisUp): void

更新监听器的位置和方向。

参数 类型 描述
position Number[] 自己在世界坐标系中的坐标。参数是一个长度为3的数字数组,三个值依次代表右、前、上的坐标值。
axisRight Number[] 自身坐标系中的右轴向量。参数是一个长度为3的数字数组,三个值依次代表右、前、上的坐标值。
axisForward Number[] 自身坐标系中的前轴向量。参数是一个长度为3的数字数组,三个值依次代表右、前、上的坐标值。
axisUp Number[] 自身坐标系中的上轴向量。参数是一个长度为3的数字数组,三个值依次代表右、前、上的坐标值。

例子:

client.updateSelf3DSpatialPosition([100, 0, 0], [2, 1, 0], [-1, 2, 0], [0, 0, 1])

Client.updateRemote3DSpatialPosition(userId, position): void

你可以通过自己的同步服务获得远程用户的位置信息。并更新远程用户的位置信息。

参数 类型 描述
userId String 远程用户ID。
position Number[] 自己的坐标,在世界坐标系中。该参数是一个长度为3的数字数组,三个值依次代表右、前和上的坐标值。

例子:

client.updateRemote3DSpatialPosition('tom', [100, 200, 0]);

Client.set3DSpatialReceivingRange(range): void

设置音频接收距离的最大范围。

参数 类型 描述
range Number 音频接收距离的最大范围。默认范围。10000

例子:

client.set3DSpatialReceivingRange(10000);