javascript – XMLHttpRequest和http流

2019-08-29 18:38:18 阅读：220 来源： 互联网

标签：javascript html5 audio xmlhttprequest icecast

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

> HTML5<音频>让我轻松播放流,但据我所知,不允许访问原始音频数据.它只是播放它.
> JS XMLHTTPRequest可以通过HTTP下载文件并处理原始音频数据.它似乎是一个很好的候选者,但它受到限制：它不会授权访问二进制数据,直到下载完成(readystate = 4).在我的例子中,流是无限的,因此readystate永久保持在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 onl oad");
  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在托管在localhost服务器上的页面上运行.

解决方法:

以下解决方法有效：

如MDN 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消耗.

标签：javascript,html5,audio,xmlhttprequest,icecast
来源： https://codeday.me/bug/20190829/1762783.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript – XMLHttpRequest和http流