检测声音Javascript

Question

是否有任何方法检测某个页面是否使用jscript制作噪音？某种环境变量或跟踪扬声器状态的东西？我试图编写一个脚本，如果该标签正在发出声音，则会在标题标题上放置一个图标。

Answer 1

不，这是不可能的。

大量的插件可以发出声音，而且它们都以自己的方式完成。这里没有任何东西。

也许在Vista/7上，应用程序的声音使用情况实际上是跟踪的，而且当使用类似Chrome的浏览器为每个页面创建单独的进程时，您可能会有更多的运气。这将涉及确定哪些进程正在播放声音，然后确定每个进程加载的页面。通过JavaScript虽然？没门。

Answer 2

我不认为你可以检测到发言者是否在JavaScript中发出噪音，但是你可能不需要。

也许你可以隐式地记住这个。举例来说，如果有播放按钮，点击就可以开始播放音频并显示图标。一旦用户点击停止按钮，您停止音频并隐藏图标。

Answer 3

从Quora

在网络上大部分的声音刮过 通过Flash来完成。 Flash不会 通知浏览器何时发出 声音。也就是说，如果两个 不同的选项卡正在运行Flash，则 浏览器无法知道哪个是 发出声音。

引进HTML5媒体 标签可以帮助在这一领域，但我 怀疑的音频指标，只有 工作一些时间（非Flash 页）会比 没有音频指标更令人沮丧。

（不注意下面的评论（在链接的Quora的问题）说，浏览器就会显示在播放声音。那是的SoundCloud改变了自己的网页，而不是谷歌浏览器标题的“播放”图标）

Answer 4

这可以帮助你，fbc_array是de阵列噪音使用fbc_array[value]为得到这种噪音。 例如：

window.onload = function() { 
 
    var file = document.querySelector('input'); 
 
    file.onchange = function(e) { 
 
    var boton = e.target.files; 
 
    var archivo = boton[0]; 
 
    if (!archivo.type.match(/audio/)) { 
 
     alert("Seleciona un audio, por favor."); 
 
    } else { 
 
     var lector = new FileReader(); 
 
     lector.readAsDataURL(archivo); 
 
     lector.addEventListener("load", initMp3Player, false); 
 
    } 
 
    } 
 

 
    function initMp3Player(e) { 
 
    var result = e.target.result; 
 
    var audio = document.querySelector('audio'); 
 
    audio.src = result; 
 
    context = new AudioContext(); 
 
    analyser = context.createAnalyser(); 
 
    source = context.createMediaElementSource(audio); 
 
    source.connect(analyser); 
 
    analyser.connect(context.destination); 
 
    frameLooper(); 
 
    } 
 

 
    function frameLooper() { 
 
    window.requestAnimationFrame(frameLooper); 
 
    fbc_array = new Uint8Array(analyser.frequencyBinCount); 
 
    analyser.getByteFrequencyData(fbc_array); 
 
    document.querySelector('#o1').style.transform = 'scale(' + fbc_array[1]/75 + ')'; 
 
    document.querySelector('#o2').style.transform = 'scale(' + fbc_array[50]/100 + ')'; 
 
    document.querySelector('#o3').style.transform = 'scale(' + fbc_array[100]/200 + ')'; 
 
    } 
 
}

* { 
 
    margin: 0; 
 
    padding: 0; 
 
    cursor: default; 
 
} 
 
body { 
 
    background: #222; 
 
} 
 
input { 
 
    position: fixed; 
 
    left: 0; 
 
    right: 0; 
 
    margin: auto; 
 
    background: rgb(76, 142, 250); 
 
    border: 0; 
 
    border-radius: 2px; 
 
    box-sizing: border-box; 
 
    color: #fff; 
 
    cursor: pointer; 
 
    font-size: .875em; 
 
    padding: 10px 24px; 
 
} 
 
#o1 { 
 
    position: fixed; 
 
    display: block; 
 
    top: 0; 
 
    bottom: 0; 
 
    left: 0; 
 
    right: 0; 
 
    height: 100px; 
 
    width: 100px; 
 
    background: #333; 
 
    margin: auto; 
 
    border-radius: 50%; 
 
} 
 
#o2 { 
 
    position: fixed; 
 
    display: block; 
 
    top: 0; 
 
    bottom: 0; 
 
    left: 0; 
 
    right: 0; 
 
    height: 100px; 
 
    width: 100px; 
 
    margin: auto; 
 
    background: #0074d9; 
 
    border-radius: 50%; 
 
} 
 
#o3 { 
 
    position: fixed; 
 
    display: block; 
 
    top: 0; 
 
    bottom: 0; 
 
    left: 0; 
 
    right: 0; 
 
    height: 100px; 
 
    width: 100px; 
 
    margin: auto; 
 
    background: #fff; 
 
    border-radius: 50%; 
 
}

<input type="file"></input> 
 
<audio autoplay></audio> 
 
<div id="o1"></div> 
 
<div id="o2"></div> 
 
<div id="o3"></div>