为啥我的第二个音频文件不能使用 currentTime 属性播放？

Posted 2023-02-25

【中文标题】为啥我的第二个音频文件不能使用 currentTime 属性播放？

【英文标题】：Why does my second audio file not play using the currentTime property?为什么我的第二个音频文件不能使用 currentTime 属性播放？

【发布时间】：2018-10-04 04:45:06

【问题描述】：

我希望在 audio1.currentTime 为 3 秒时播放我的 audio2 文件，但我无法让它工作。我是javascript的新手，我错过了什么？这是我当前的 javascript 代码：

    function initAudioPlayer()
            var audio1, audio2, ext, agent;

            ext = ".mp3";
            agent = navigator.userAgent.toLocaleLowerCase();

            if(agent.indexOf('firefox') != -1 || agent.indexOf('opera') != -1)  ext = ".ogg";


//Audio Objects: audio1 and audio2

            audio1 = new Audio();
            audio1.src = "folder/Audio1"+ext;
            audio1.loop = false;
            audio1.play();

            audio2 = new Audio();
            audio2.src = "folder/Audio2"+ext;
            audio2.loop = false;
            audio2.play();

//Function that reproduces the second audio file at second 3 of the first audio file

    function audio2()
            if(audio1.currentTime == 3) audio2.play();
        ;    
    

    window.addEventListener("load", initAudioPlayer);

【问题讨论】：

您要合并主题并播放最终音频吗？

是的@MehranHafizi！但一个接一个地开始。

【参考方案1】：

您必须使用 Audio Api 并获取文件的缓冲区。 然后你必须加上每个字节并复制到另一个新缓冲区。 这段代码可以帮助你：

let idnex=0;
    samples.forEach(buufer => 


      if (index === 0) 
        tempBuf = buufer;
       else 
        tempBuf = this.appendBuffer(tempBuf, buufer);
      
      index++;
    );

通过这个方法你可以附加两个缓冲区：

 private appendBuffer(buffer1, buffer2) 


const numberOfChannels = Math.min(buffer1.numberOfChannels, buffer2.numberOfChannels);
const tmp = this.audioContextService.createBuffer(Math.max(buffer1.numberOfChannels, buffer2.numberOfChannels),
  Math.max(buffer1.length, buffer2.length), buffer1.sampleRate);

for (let i = 0; i < numberOfChannels; i++) 

  const channel = tmp.getChannelData(i);
  let finallArray = [];
  let d = [];
  const chanelTemp = buffer1.getChannelData(i);


  if (buffer2.numberOfChannels <= i) 

    finallArray = chanelTemp;
   else 
    const c = buffer2.getChannelData(i);
    if (chanelTemp.length > c.length) 

      finallArray = chanelTemp;
      d = c;
     else 

      finallArray = c;
      d = chanelTemp;
    

    for (let j = 0; j < d.length; j++) 

      finallArray[j] += d[j] / 2;


    

  


  channel.set(finallArray, i);

你可以看我的演示here

---

你也可以看到this Answer

【讨论】：

我去年做了很多工作。如果它可以帮助你，请检查答案是否正确

【参考方案2】：

如果你真的希望它在时间上准确，你不能使用 Audio() - 那是 html5 元素，它不是样本准确的。 Javascript 在事件传递方面也不够准确，无法使用回调来执行此操作（公平地说，大多数通用本机 OS API 也不是）。您需要提前安排播放，这就是 Web Audio (https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API) 的用武之地。您需要加载两个样本，将它们解码到 AudioBuffers 中，然后使用 AudioBufferSourceNode 安排每个样本的播放。