Javascript 通过WebSocket将音频流传输到Web音频播放器

Javascript 通过WebSocket将音频流传输到Web音频播放器,javascript,html,audio,web-audio-api,Javascript,Html,Audio,Web Audio Api,我有一个工作系统 在服务器上以1秒的WAV文件格式生成音频 读取WAV文件并通过websocket发送 Websocket将二进制数据发送到AudioContext.decodeAudioData 解码音频缓冲到4个数据包(4秒) 缓冲区被处理并发送到AudioBufferSourceNode.start(时间),其中时间=(剪辑计数*持续时间) 因此,如果我有4个音频剪辑,通话将看起来像 AudioBufferSourceNode.start(0); AudioBufferSourceNode

我有一个工作系统

  • 在服务器上以1秒的WAV文件格式生成音频
  • 读取WAV文件并通过websocket发送
  • Websocket将二进制数据发送到AudioContext.decodeAudioData
  • 解码音频缓冲到4个数据包(4秒)
  • 缓冲区被处理并发送到AudioBufferSourceNode.start(时间),其中时间=(剪辑计数*持续时间)
  • 因此,如果我有4个音频剪辑,通话将看起来像

    AudioBufferSourceNode.start(0);
    AudioBufferSourceNode.start(1);
    AudioBufferSourceNode.start(2);
    AudioBufferSourceNode.start(3);
    
    我认为这将完美地安排4秒的音频,但我似乎面临着时钟问题,也许是因为我期望音频时钟是完美的。我已经使用了一个增益节点来消除每个声音片段(1秒)之间的点击,但我开始立即或在很长一段时间后出现计时问题。基本上,在最坏的情况下,我的音频是这样播放的

     ----------------------  -----------     -----------     -----------
    | 1 second | 1 second |  |   950ms |     |  900ms  |    |   850ms  |
     ----------------------  -----------     -----------     -----------
                           gap          gap              gap
    
    在这个图表中,“1秒”和“#ms”是播放的音频量。它应该始终为1秒。随着音频的发展,似乎也出现了一些差距。我想,即使我告诉音频上下文以0的准确频率播放文件,也没关系,但其他预定的音频剪辑可能会准时播放,也可能不会准时播放


    这是正确的,还是我的系统出现了其他问题?我是否有100%的可靠性可以安排在准确的时间播放音频剪辑,或者我是否需要添加一些计算来计算播放时间+/-几毫秒?

    看起来,用于此任务的东西是

    根据:

    AudioBufferSourceNode接口是AudioScheduledSourceNode,它表示由存储在AudioBuffer中的内存音频数据组成的音频源。它特别适用于播放具有特别严格的计时精度要求的音频,例如必须符合特定节奏且可以保存在内存中而不是从磁盘或网络播放的声音。要播放需要精确计时但必须从网络流式传输或从磁盘播放的声音,请使用AudioWorkletNode实现其播放

    这个案例正好实现了从网络流式传输。AudioBufferSourceNode是设计用于从网络实时更新的

    什么会导致失同步

  • 根据javascript调度器的性质,无法保证在准确的时间执行代码。节点可能同时执行另一个作业,这会导致发送信息的延迟
  • 计时器在发送所有数据后运行下一个滴答声,这可能需要一些时间
  • 客户端调度器比服务器端调度器有更多的限制。通常,浏览器每秒可以执行大约250个计时器(每4ms一个)
  • 使用的API不是为该流设计的
  • 建议

  • 始终保留缓冲区。若出于某种原因,缓冲区中的帧已经播放,那个么请求新帧的速度可能会更快
  • 动态增加缓冲区。在收到两条消息后,可以开始播放,但可以将动态缓冲消息的数量增加到15秒左右
  • 希望使用其他工具来处理连接和数据传输。Nginx将提供完美的服务。如果客户端连接速度较慢,它将“保持”节点,直到数据传输
  • 在连接中断一秒钟的情况下(例如,在移动网络上),应该有一些东西可以从适当的帧恢复状态,更新缓冲区并在不中断的情况下执行所有这些操作

  • 我希望看到一个使用最新的网络音频API的工作演示解决方案tricks@ScottStensland您是否遇到了类似的问题?@terratwoa我认为进一步检查需要一个完整的演示。我还需要将音频从服务器传输到浏览器。。。过去,我使用webworker、web音频api、WebSocket和nodejs创建了一个工作解决方案。。。现在正在建设一个新项目,所以是的,我在同一条船上。。。打我