XMLHttpRequest 和 http 流

我的目标是从浏览器读取 HTTP MP3 音频流并访问原始音频数据.

• HTML5 让我可以轻松播放流，但据我所知，不允许访问原始音频数据。它只是播放它。

• JS XMLHTTP请求可以通过HTTP下载文件并处理原始音频数据。它似乎是一个很好的候选者，但它有一个限制：在下载完成（readystate = 4）之前它不会授予对二进制数据的访问权限。在我的例子中，流是无限的，因此就绪状态永久保持在 3 并且 XHR 响应为空（mozilla 文档中详细介绍了此行为）。请注意，我连接的服务器的跨域策略是 Access-Control-Allow-Origin: *

适用于本地常规文件但不适用于流的代码示例。我在 request.response.length 处收到空指针异常

request = new XMLHttpRequest();
//request.open('GET', 'test.mp3', true);
request.open('GET', 'http://domain.com/stream.mp3', true);
request.responseType = 'arraybuffer';
request.onload = function() {
  console.log("request onload");
  var audioData = request.response;
  audioCtx.decodeAudioData(audioData, 
    function(buffer) { myBuffer = buffer; source.buffer = myBuffer; }, 
    function(e){"Error with decoding audio data" + e.err}
  );
}
request.onreadystatechange = function() {
    console.log("ready state = " + request.readyState);
    console.log(request.response.length);
}
request.send();

有谁知道这些选项的替代方案或解决方法，以便在下载流时可以读取原始二进制数据包？

请注意，我无法控制服务器。这是一个icecast http 流。 另外，在浏览器方面，我想避免使用 Flash。 谢谢

编辑：为了澄清可能的跨域问题，JS 在本地主机服务器托管的页面上运行。

以下解决方法有效：

正如 MDN 中所述https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data，可以覆盖http请求的MIME类型，将其设置为自定义，并调用responseText。

function load_binary_resource(url) {
  var req = new XMLHttpRequest();
  req.open('GET', url, false);
  //XHR binary charset opt by Marcus Granado 2006 [http://mgran.blogspot.com]
  req.overrideMimeType('text\/plain; charset=x-user-defined');
  req.send(null);
  if (req.status != 200) return '';
  return req.responseText;
} 

关键是 req.responseText 不会受到 req.response 的相同限制。在readystate=3状态下不为null。 然后，通过以下方式访问二进制responseText

var filestream = load_binary_resource(url);
var abyte = filestream.charCodeAt(x) & 0xff; // throw away high-order byte (f7)

一个显着的缺点是 req.responseText 随着流的下载而不断增长。应不时重置请求以避免过多的 RAM 消耗。