草庐IT

html - Firefox WebAudio createMediaElementSource 不工作

coder 2023-08-02 原文

我将 WebAudio API 与 new Audio() 对象用作源。以下是我正在做的事情的简化版本。然而,这不会在 firefox 25.0.1 中播放任何声音。

var context;
if(window.webkitAudioContext) {
    context = new webkitAudioContext();
} else {
    context = new AudioContext();
}
var audio = new Audio();

// This file does seem to have CORS Header
audio.src = "http://upload.wikimedia.org/wikipedia/en/4/45/ACDC_-_Back_In_Black-sample.ogg";

var source;
function onCanPlay() {
    console.log("can play called");
    source = context.createMediaElementSource(audio);
    source.connect(context.destination);
    audio.removeEventListener("canplay", onCanPlay);
    audio.play();
}

if(audio.readyState < 3) {
    audio.addEventListener("canplay", onCanPlay);
} else {
    onCanPlay();
}

jsFiddle:http://jsfiddle.net/7bJUU/

我读了另一个question createMediaElementSource 需要 CORS。上面示例中的文件似乎有 Access-Control-Allow-Origin: * 但它在 firefox 中仍然不起作用。如果我使用本地音频文件在本地运行相同的示例,一切正常。

不确定这是错误还是我做错了什么。感谢您的帮助。

最佳答案

原因如下:

  1. Firefox(在 2015 年 10 月 7 日更新到 41.0.1 之前和之后进行了测试)似乎在安全套接字 HTTP 上的不安全跨域方面存在一些问题。我更新到 https: 在媒体源上,因为维基媒体有替代 443 TCP 和颁发给“Wikimedia Foundation, Inc.”的有效证书。从 2015 年 6 月 23 日到 2017 年 2 月 19 日,来自 CA“GlobalSign”。在安全域中时,浏览器也习惯于要求安全资源。
  2. 音频 DOM 元素和其他元素(如图像和视频)具有“crossOrigin”属性,该属性指定是否提供凭据(cookie)。匿名跨域指定不会将域cookie交换到跨域,这被浏览器认为是安全的。因此,在指定音频源之前,我将“audio.crossOrigin”设置为“anonymous”。

我在 Firefox(如第一项所述)和 Chrome 45.0.2454.101m 上进行了测试,它们运行良好,因此我在 JSFiddle 上进行了更新:https://jsfiddle.net/7bJUU/11/ 7bJUU

关于html - Firefox WebAudio createMediaElementSource 不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20180550/

有关html - Firefox WebAudio createMediaElementSource 不工作的更多相关文章

随机推荐