admin管理员组文章数量:1026912
I developed one web-based monitoring system Using js and WebRTC and now I want to develop notification function if the sound goes beyond some level.
I'm taking permission for video and audio and after permission, I want to use the function for sound notification.
navigator.mediaDevices
.getUserMedia({
audio: true,
video: true
})
.then(stream => {
// Display your local video in #localVideo element
localVideo.srcObject = stream;
// Add your stream to be sent to the conneting peer
pc.addStream(stream);
// call function for sound check
}, onError);
I developed one web-based monitoring system Using js and WebRTC and now I want to develop notification function if the sound goes beyond some level.
I'm taking permission for video and audio and after permission, I want to use the function for sound notification.
navigator.mediaDevices
.getUserMedia({
audio: true,
video: true
})
.then(stream => {
// Display your local video in #localVideo element
localVideo.srcObject = stream;
// Add your stream to be sent to the conneting peer
pc.addStream(stream);
// call function for sound check
}, onError);
2 Answers
Reset to default 3You can use this code.
<!DOCTYPE html>
<html>
<head>
<script>
navigator.mediaDevices.getUserMedia({ audio: true }).then(function(stream) {
audioContext = new AudioContext();
analyser = audioContext.createAnalyser();
microphone = audioContext.createMediaStreamSource(stream);
javascriptNode = audioContext.createScriptProcessor(2048, 1, 1);
analyser.smoothingTimeConstant = 0.8;
analyser.fftSize = 1024;
microphone.connect(analyser);
analyser.connect(javascriptNode);
javascriptNode.connect(audioContext.destination);
javascriptNode.onaudioprocess = function() {
var array = new Uint8Array(analyser.frequencyBinCount);
analyser.getByteFrequencyData(array);
var values = 0;
var length = array.length;
for (var i = 0; i < length; i++) {
values += (array[i]);
}
var average = values / length;
if(Math.round(average)>15)
{
console.log(Math.round(average));
document.getElementById("lvl").innerHTML = Math.round(average)-10;
}
}
})
.catch(function(err) {
/* handle the error */
});
</script>
</head>
<center><p id="lvl" style="font-size:200px"></p><center>
</html>
Copy and make it an HTML file and open it in chrome and make some sound. You will e to know how it's work and if it is the same as you need copy function from the 5th line and make it one separate function and call this function is your code.
Hope it's work for you
Here is an updated snippet that doesn't use onaudioprocess:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<center><p id="lvl" style="font-size:200px"></p><center>
<script>
navigator.mediaDevices.getUserMedia({ audio: true }).then(function(stream) {
const audioContext = new AudioContext();
const analyser = audioContext.createAnalyser();
const microphone = audioContext.createMediaStreamSource(stream);
analyser.smoothingTimeConstant = 0.8;
analyser.fftSize = 1024;
microphone.connect(analyser);
setInterval(() => {
const array = new Uint8Array(analyser.frequencyBinCount);
analyser.getByteFrequencyData(array);
let sum = 0;
for (let i = 0; i < array.length; i++) {
sum += array[i];
}
const average = sum / array.length;
if (Math.round(average) > 15) {
document.getElementById("lvl").textContent = Math.round(average) - 10;
}
}, 100);
}).catch(function(err) {
console.error('Error accessing microphone: ', err);
});
</script>
</body>
</html>I developed one web-based monitoring system Using js and WebRTC and now I want to develop notification function if the sound goes beyond some level.
I'm taking permission for video and audio and after permission, I want to use the function for sound notification.
navigator.mediaDevices
.getUserMedia({
audio: true,
video: true
})
.then(stream => {
// Display your local video in #localVideo element
localVideo.srcObject = stream;
// Add your stream to be sent to the conneting peer
pc.addStream(stream);
// call function for sound check
}, onError);
I developed one web-based monitoring system Using js and WebRTC and now I want to develop notification function if the sound goes beyond some level.
I'm taking permission for video and audio and after permission, I want to use the function for sound notification.
navigator.mediaDevices
.getUserMedia({
audio: true,
video: true
})
.then(stream => {
// Display your local video in #localVideo element
localVideo.srcObject = stream;
// Add your stream to be sent to the conneting peer
pc.addStream(stream);
// call function for sound check
}, onError);
2 Answers
Reset to default 3You can use this code.
<!DOCTYPE html>
<html>
<head>
<script>
navigator.mediaDevices.getUserMedia({ audio: true }).then(function(stream) {
audioContext = new AudioContext();
analyser = audioContext.createAnalyser();
microphone = audioContext.createMediaStreamSource(stream);
javascriptNode = audioContext.createScriptProcessor(2048, 1, 1);
analyser.smoothingTimeConstant = 0.8;
analyser.fftSize = 1024;
microphone.connect(analyser);
analyser.connect(javascriptNode);
javascriptNode.connect(audioContext.destination);
javascriptNode.onaudioprocess = function() {
var array = new Uint8Array(analyser.frequencyBinCount);
analyser.getByteFrequencyData(array);
var values = 0;
var length = array.length;
for (var i = 0; i < length; i++) {
values += (array[i]);
}
var average = values / length;
if(Math.round(average)>15)
{
console.log(Math.round(average));
document.getElementById("lvl").innerHTML = Math.round(average)-10;
}
}
})
.catch(function(err) {
/* handle the error */
});
</script>
</head>
<center><p id="lvl" style="font-size:200px"></p><center>
</html>
Copy and make it an HTML file and open it in chrome and make some sound. You will e to know how it's work and if it is the same as you need copy function from the 5th line and make it one separate function and call this function is your code.
Hope it's work for you
Here is an updated snippet that doesn't use onaudioprocess:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<center><p id="lvl" style="font-size:200px"></p><center>
<script>
navigator.mediaDevices.getUserMedia({ audio: true }).then(function(stream) {
const audioContext = new AudioContext();
const analyser = audioContext.createAnalyser();
const microphone = audioContext.createMediaStreamSource(stream);
analyser.smoothingTimeConstant = 0.8;
analyser.fftSize = 1024;
microphone.connect(analyser);
setInterval(() => {
const array = new Uint8Array(analyser.frequencyBinCount);
analyser.getByteFrequencyData(array);
let sum = 0;
for (let i = 0; i < array.length; i++) {
sum += array[i];
}
const average = sum / array.length;
if (Math.round(average) > 15) {
document.getElementById("lvl").textContent = Math.round(average) - 10;
}
}, 100);
}).catch(function(err) {
console.error('Error accessing microphone: ', err);
});
</script>
</body>
</html>本文标签： audioHow to get Volume level using JavaScriptStack Overflow
版权声明：本文标题：audio - How to get Volume level using JavaScript? - Stack Overflow 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745654020a2161489.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论