相关疑难解决方法(0)

有没有办法使用Web Audio API比实时更快地采样音频?

我正在玩Web Audio API并尝试找到导入mp3的方法(所以这只在Chrome中),并在画布上生成它的波形.我可以实时做到这一点,但我的目标是比实时更快地做到这一点.

我能够找到的所有示例都涉及从onaudioprocess事件附带的函数中读取分析器对象的频率数据:

processor = context.createJavascriptNode(2048,1,1);
processor.onaudioprocess = processAudio;
...
function processAudio{
    var freqByteData = new Uint8Array(analyser.frequencyBinCount);
    analyser.getByteFrequencyData(freqByteData);
    //calculate magnitude & render to canvas
}
Run Code Online (Sandbox Code Playgroud)

但是看起来,analyser.frequencyBinCount只有在播放声音时才会填充(有关填充缓冲区的信息).

我想要的是能够尽可能快地手动/编程地逐步浏览文件,以生成画布图像.

到目前为止我得到的是:

$("#files").on('change',function(e){
    var FileList = e.target.files,
        Reader = new FileReader();

    var File = FileList[0];

    Reader.onload = (function(theFile){
        return function(e){
            context.decodeAudioData(e.target.result,function(buffer){
                source.buffer = buffer;
                source.connect(analyser);
                analyser.connect(jsNode);

                var freqData = new Uint8Array(buffer.getChannelData(0));

                console.dir(analyser);
                console.dir(jsNode);

                jsNode.connect(context.destination);
                //source.noteOn(0);
            });
        };
    })(File);

    Reader.readAsArrayBuffer(File);
});
Run Code Online (Sandbox Code Playgroud)

但是getChannelData()总是返回一个空的类型数组.

任何见解都会受到赞赏 - 即使事实证明它无法完成.我想我是唯一一个互联网想要做的东西,在实时.

谢谢.

javascript html5 webkit web-audio-api

17
推荐指数
2
解决办法
7123
查看次数

由于 cookie,Wavesurfer 不会绘制带有 CROS 错误的波形

我使用wavesurfer,出现以下错误:

XMLHttpRequest cannot load https://audiotemp.domain.net/RE65bbf6f0a2760184ab08b3fbf9f1d249.mp3. 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://my.domain.net:3000' is therefore not allowed access. The response had HTTP status code 403.
Run Code Online (Sandbox Code Playgroud)

调用已加载,但未绘制波形,我检查了请求网络,发现此调用的两个请求如下:

  1. 403 禁止。

403

  1. 304 未修改。

304

加载调用的代码如下:

scope.wavesurfer.load(scope.url);
Run Code Online (Sandbox Code Playgroud)

对于第二张图片,我发现有 cookie 随请求一起发送,如下所示:

Cookie:__zlcmid=TAePb8mwejYLug; calltrk_referrer=https%3A//app.gotomeeting.com/%3FmeetingId%3D306279333; calltrk_landing=https%3A//www.dentalmarketing.net/capture/; calltrk_session_id_150722382=c16eaa33-386f-4ab3-ba8d-b3d0cff070ef; __utma=52313532.1896763581.1423186152.1427741816.1431536946.4; __utmz=52313532.1431536946.4.3.utmcsr=bigleap.com|utmccn=(referral)|utmcmd=referral|utmcct=/utahs-best-brightest/; _ga=GA1.2.1896763581.1423186152; CloudFront-Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9hdWRpb3RlbXAuZGVudGFsbWFya2V0aW5nLm5ldC8qIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNDMzMDE2ODQ5fX19XX0_; CloudFront-Signature=btJ4dYPe3Cv87mQZzb6dkYVOLRcKQbscJ3h-ZJgSWGikNi1nXLuYXCGIwsHJWbhdTRiP8Gjru0mIQyOJdCioOa4tP3sAOSGXl9Cy1T2bM1sahgWZZ3GSk6GMyi21TVy3YsxDEdTUoMipeE0b5CduzcpcquB3hjYtfOUwI6CIrsTXkhajrGAk1rg~6tItPqMtxgmwrRM1oM8th0UgxgPWwVD2pok1ecS5ylwOiXbnSETpQzgXqS0C37bT94KpvafCjaclqgQPNcXrZRqbK~HLh28Gd4IZ3pDzIr3GNe3lkDUVIBYbStDsGZtawnS53ASmGXl3rP~DrPKYlahYX~ajKg__; CloudFront-Key-Pair-Id=APKAJL5DFWOODOOKTH2A
Run Code Online (Sandbox Code Playgroud)

我使用 Node.js 代码放置了这个 cookie,如下所示:

res.cookie('CloudFront-Policy',encodedCustomPolicy,{domain :cookieDomainName , path:'/', httpOnly:true,secure:true});
res.cookie('CloudFront-Signature',customPolicySignature,{domain :cookieDomainName , path:'/', httpOnly:true,secure:true});
res.cookie('CloudFront-Key-Pair-Id',cloudFrontKeyPairId,{domain :cookieDomainName , path:'/', httpOnly:true,secure:true}
Run Code Online (Sandbox Code Playgroud)

所以,我需要在第一个请求上放置三个 cookie,以获取调用并绘制它的波形。

  1. 如何通过第一个请求发送 cookie?
  2. 当我调用 wavesurfer 的加载功能时如何放置标题?

javascript cookies amazon-web-services node.js angularjs

5
推荐指数
1
解决办法
2536
查看次数

通过客户端XHR打开Soundcloud Track的stream_url?

既然你可以通过XHR调用Soundcloud API(因为它发送的是CORS标题http://backstage.soundcloud.com/2010/08/of-cors-we-do/,对吗?)我想知道这是不是可以使用音频数据本身,例如轨道的stream_url.

当尝试使用Web Audio API使用XHR(来自客户端)打开stream_url时,我得到Access-Control-Allow-Origin不允许使用Origin.错误.有没有办法从Client-Side-Javascript通过XHttpRequest加载音频资源,或者是不可能的(/sf/ask/761031771/) ?

会很棒,因为这将允许一些非常酷的Web Audio API.

谢谢!

UPDATE

问题可能与调用时获得的302重定向有关:

http://api.soundcloud.com/tracks/5646378/stream.json?client_id=[client_id]
Run Code Online (Sandbox Code Playgroud)

或其他一些请求实际媒体文件的电话(见评论).

HTTP/1.1 302 Moved Temporarily
Server: nginx
Date: Sun, 24 Jun 2012 09:58:01 GMT
Content-Type: application/json; charset=utf-8
Connection: keep-alive
Cache-Control: no-cache
Location: http://ec-media.soundcloud.com/[...]
X-Runtime: 41
Content-Length: 339
Access-Control-Allow-Methods: GET, PUT, POST, DELETE
Access-Control-Allow-Headers: Accept, Authorization, Content-Type, Origin
Access-Control-Allow-Origin: *
X-Cacheable: NO:Cache-Control=no-cache
X-Varnish: 2433107209
Age: 0
Via: 1.1 varnish
X-Cache: MISS

HTTP/1.1 200 OK
Accept-Ranges: bytes
Cache-Control: max-age=252460800
Content-Type: audio/mpeg
Date: Sun, …
Run Code Online (Sandbox Code Playgroud)

streaming cors html5-audio soundcloud web-audio-api

4
推荐指数
2
解决办法
3475
查看次数