11

Safari 或 Firefox 都无法MediaElementSource使用 Web Audio API 处理来自 a 的音频数据。

var audioContext, audioProcess, audioSource,
    result = document.createElement('h3'),
    output = document.createElement('span'),
    mp3 = '//www.jonathancoulton.com/wp-content/uploads/encodes/Smoking_Monkey/mp3/09_First_of_May_mp3_3a69021.mp3',
    ogg = '//upload.wikimedia.org/wikipedia/en/4/45/ACDC_-_Back_In_Black-sample.ogg',
    gotData = false, data, audio = new Audio();
 
function connect() {
  audioContext = window.AudioContext ? new AudioContext() : new webkitAudioContext(),
  audioSource  = audioContext.createMediaElementSource( audio ),
  audioScript  = audioContext.createScriptProcessor( 2048 );
 
  audioSource.connect( audioScript );
  audioSource.connect( audioContext.destination );
  audioScript.connect( audioContext.destination );
  audioScript.addEventListener('audioprocess', function(e){
    if ((data = e.inputBuffer.getChannelData(0)[0]*3)) {
      output.innerHTML = Math.abs(data).toFixed(3);
      if (!gotData) gotData = true;
    }
  }, false);
}
 
(function setup(){
  audio.volume = 1/3;
  audio.controls = true;
  audio.autoplay = true;
  audio.src = audio.canPlayType('audio/mpeg') ? mp3 : ogg;
  audio.addEventListener('canplay', connect);
  result.innerHTML = 'Channel Data: ';
  output.innerHTML = '0.000';
  document.body.appendChild(result).appendChild(output);
  document.body.appendChild(audio);
})();

有没有计划在不久的将来修补这个问题？或者是否有一些解决方法仍然可以为用户提供音频控制？

对于 Apple 来说，这可以在 WebKit Nightlies 中修复，还是我们必须等到 Safari 8.0发布才能让 HTML5<audio>与 Web Audio API 很好地配合？Web Audio API 至少从 6.0 版开始就存在于 Safari 中，我最初在 Safari 7.0 发布之前很久就发布了这个问题。有没有理由这还没有解决？它会被修复吗？

对于 Mozilla，我知道您仍在从旧的音频数据 API 进行切换，但这是您的 Web 音频实现的一个已知问题吗？它会在 Firefox 的下一个版本之前得到解决吗？

4

2 回答 2

5

这个答案几乎完全来自我对相关问题的回答：Firefox 25 and AudioContext createJavaScriptNote not a function

如果媒体遵守Same-Origin Policy ， Firefox确实支持，但是当尝试使用来自远程来源的媒体时，Firefox 不会产生错误。MediaElementSource

该规范并没有真正具体说明它（双关语），但有人告诉我这是一种预期的行为，问题实际上出在 Chrome 上……需要更新 Blink 实现（Chrome、Opera）以要求科尔斯。

MediaElementSource 节点和跨域媒体资源：

From: Robert O'Callahan <robert@ocallahan.org>
Date: Tue, 23 Jul 2013 16:30:00 +1200
To: "public-audio@w3.org" <public-audio@w3.org>

HTML 媒体元素可以播放来自任何来源的媒体资源。当一个元素从与页面来源不同的来源播放媒体资源时，我们必须防止页面脚本能够读取媒体的内容（例如提取视频帧或音频样本）。特别是我们应该阻止 ScriptProcessorNodes 访问媒体的音频样本。我们还应该了解有关以其他方式泄漏的样本的信息（例如定时通道攻击）。目前，网络音频规范对此只字未提。

我认为我们应该通过防止任何非同源数据进入 Web Audio 来解决这个问题。这将最大限度地减少攻击面和对 Web 音频的影响。

我的建议是让 MediaElementAudioSourceNode 将来自不同源流的数据转换为静音。

如果这个提议成为规范，开发人员几乎不可能意识到他为什么MediaElementSource不工作。就目前而言，在Firefox 26createMediaElementSource()中调用一个<audio>元素实际上完全停止了控件的工作并且没有抛出任何错误。<audio>

您可以对来自远程来源的音频/视频数据做哪些危险的事情？一般的想法是，如果不对节点应用同源策略MediaElementSource，一些恶意 javascript 可以访问只有用户应该有权访问的媒体（会话、vpn、本地服务器、网络驱动器）并发送其内容或某些表示它——对攻击者。

默认情况下，HTML5 媒体元素没有这些限制。<audio>您可以使用、<img>或<video>元素在所有浏览器中包含远程媒体。只有当您想从这些远程资源中操作或提取数据时，同源策略才会发挥作用。

[它] 出于同样的原因，您不能通过以下方式跨域转储图像数据<canvas>：媒体可能包含敏感信息，因此允许流氓网站转储和重新路由内容是一个安全问题。- @nmaier

于 2014-04-21T17:44:17.093 回答
1

createMediaElementSource() 在 Safari 8.0.5（可能更早版本）中无法正常工作，但在 Webkit Nightly 中已修复，截至 10600.5.17, r183978

于 2015-05-08T18:51:39.000 回答