title: how to stream audio chunks using web audio API coming from web-socket?
body: <p>I am streaming audio data in chunks through web-Socket from server</p>
  
  <pre><code>ws.on('message', function incoming(message) {
      var readStream = fs.createReadStream("angular/data/google.mp3",
          {
              'flags': 'r',
              'highWaterMark': 128 * 1024
          }
      );
      readStream.on('data', function(data) {
          ws.send(data);
      });
  
      readStream.on('end', function() {
          ws.send('end');
      });
  
      readStream.on('error', function(err) {
          console.log(err)
      });
  });
  </code></pre>
  
  <p>on the client side </p>
  
  <pre><code>var chunks = [];
  var context = new AudioContext();
  var soundSource;
  
  var ws = new WebSocket(url);
      ws.binaryType = "arraybuffer";
  
  ws.onmessage = function(message) {
      if (message.data instanceof ArrayBuffer) {
          chunks.push(message.data)
      } else {
          createSoundSource(chunks);
      }
  };
  
  function createSoundSource(audioData) {
      soundSource = context.createBufferSource();
  
      for (var i=0; i &lt; audioData.length;i++) {
          context.decodeAudioData(audioData[i], function(soundBuffer){
              soundSource.buffer = soundBuffer;
              soundSource.connect(context.destination);
              soundSource.start(0);
          });
      }
  }
  </code></pre>
  
  <p>But setting buffer <code>soundSource.buffer = soundBuffer;</code> for the second time causing an error  </p>
  
  <blockquote>
    <p>Uncaught DOMException: Failed to set the 'buffer' property on 'AudioBufferSourceNode': Cannot set buffer after it has been already been set</p>
  </blockquote>
  
  <p>Any advice or insight into how best to <code>update</code> Web Audio API playback with new audio data would be greatly appreciated.</p>