如何使用仅返回Promise的processOffline函数实现多音源同步播放？

因为processOffline是异步离线音频处理函数，它的返回值是Promise——离线处理需要时间完成，所以必须等待所有Promise执行完毕、拿到处理后的音频数据后，才能实现三个音源的同步播放。具体处理方案如下：

1. 收集所有离线处理的Promise #

如果已经将三个Promise存入FX.processors，先把它们提取出来：

// 假设你的三个音源标识符为id1、id2、id3
const allProcessorPromises = [
  FX.processors.id1,
  FX.processors.id2,
  FX.processors.id3
];

2. 等待所有处理完成并同步播放 #

使用Promise.all等待所有离线处理任务结束，拿到所有处理好的音频数据后，创建音频源节点并统一调度播放：

// 获取或创建常规音频上下文
const audioCtx = new AudioContext();

Promise.all(allProcessorPromises)
  .then((processedAudioBuffers) => {
    // 为每个处理好的音频buffer创建源节点
    processedAudioBuffers.forEach(buffer => {
      const sourceNode = audioCtx.createBufferSource();
      sourceNode.buffer = buffer;
      sourceNode.connect(audioCtx.destination);
      // 指定同一个播放起始时间，确保三个音源同步播放
      sourceNode.start(audioCtx.currentTime);
    });
  })
  .catch(error => {
    console.error('离线音频处理失败:', error);
  });

补充：初始化时同步存储并收集Promise #

如果是在调用processOffline的阶段就存储Promise，可以同时收集，避免后续重复提取：

// 定义三个音源的配置参数
const audioOptions = {
  id1: { /* 音源1的配置 */ },
  id2: { /* 音源2的配置 */ },
  id3: { /* 音源3的配置 */ }
};

// 存储Promise到全局对象，并同时收集所有Promise
const allProcessorPromises = Object.keys(audioOptions).map(identifier => {
  const promise = processOffline(audioOptions[identifier]);
  FX.processors[identifier] = promise;
  return promise;
});

// 后续执行等待和播放逻辑（代码同步骤2）

内容的提问来源于stack exchange，提问作者Mike Johnson Jr