为什么Safari或Firefox无法处理MediaElementSource的音频数据?

idb*_*old 10 javascript safari firefox html5 web-audio-api

Safari或Firefox都无法MediaElementSource使用Web Audio API 处理音频数据.

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);
})();
Run Code Online (Sandbox Code Playgroud)

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

对于Apple来说,这可以在WebKit Nightlies中修复,还是我们必须等到Safari 8.0发布才能让HTML5 <audio>与Web Audio API很好地配合?至少在6.0版本中,Web Audio API已存在于Safari中,我最初在Safari 7.0发布之前就发布了这个问题.有没有原因这个问题已经解决了?它会被修复吗?

对于Mozilla,我知道你仍然在从旧的音频数据API切换过程中,但这是你的Web音频实现的一个已知问题,是否会在下一个版本的Firefox之前修复?

idb*_*old 5

这个答案几乎完全取决于我对相关问题的回答:Firefox 25和AudioContext createJavaScriptNote不是函数

如果媒体遵守同源策略,Firefox 确实支持,但是当尝试使用来自远程源的媒体时,Firefox不会产生错误.MediaElementSource

规范是不是真的特定(双关语意),但我一直在告诉我,这是一个预期的行为,这个问题实际上是与Chrome浏览器...这是眨眼实现(铬,歌剧),其需要更新要求CORS.

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 Audio来解决这个问题.这将最小化攻击面和对Web Audio的影响.

我的建议是让MediaElementAudioSourceNode将来自非同一原始流的数据转换为静默.

如果这个提议符合规范,那么开发人员几乎不可能意识到他MediaElementSource的工作原理.由于它现在代表,呼吁createMediaElementSource()的对<audio>中元素的Firefox 26实际上停止<audio>从所有工作的控制,并引发错误.

使用来自远程原点的音频/视频数据可以做些什么危险的事情?一般的想法是,如果不将同源策略应用于MediaElementSource节点,一些恶意javascript可以访问只有用户应该访问的媒体(会话,VPN,本地服务器,网络驱动器)并发送其内容 - 或者某些表示它 - 攻击者.

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

[这是]出于同样的原因,您无法通过<canvas>以下方式转储图像数据:media可能包含敏感信息,因此允许恶意网站转储和重新路由内容是一个安全问题.- @nmaier