Questions tagged [web-audio-api]
Web Audio API is an advanced audio processing API directly available inside browser that helps to create, manipulate and analyze audio data using JavaScript.
2,549
questions
0
votes
0
answers
10
views
createMediaElementSource not working in android
I want to play an audio file, and at the same time, analyze the file
The following code runs on chrome desktop
But in chrome android (current version 119) it does not start playing
<html>
&...
1
vote
1
answer
61
views
How to get audio file decibels without playing it?
I have a function which getting every sec of audio decibels. I tried to get them without playing the audio file but it has not worked.
JavaScript (playing audio to get decibels):
export default ...
1
vote
1
answer
36
views
MediaRecorder API does not account for pauses in between WebAudio API AudioBufferSourceNodes
I'm working on a webapp where the user can interact with a digital instrument UI to play different music notes, and those notes end up being streamed to my backend. I'm using Web Audio API to convert ...
0
votes
1
answer
31
views
Save blob audio on disk width Electron [closed]
Electron: after recording an audio sequence with offline renderer and creating a blob (audio/wav) in my renderer.js, how to save this blob to disk with main.js?
0
votes
0
answers
39
views
Mixing two signals in a GainNode in web audio api
I am building an audio mixer using Web Audio API. Currently, my mixer has two channels that play an AudioSourceBufferNode and are mixed by connecting both sources to the same GainNode so the samples ...
0
votes
0
answers
28
views
Display Spotify songs in React without authentication
I want to create an audio player in React with music from Spotify. My goal is to allow the user to listen to a preview of some music I've chosen beforehand.
I apologize if I haven't gone far enough in ...
1
vote
0
answers
18
views
How can I make WebAudio.param work in Elm?
I'm just getting started with WebAudio in Elm, using hayleigh-dot-dev/elm-web-audio/1.1.1. I got the setup right, have sound, and things seems to work as intended. However, when I started using ...
0
votes
0
answers
8
views
Unable to segment audio captured from MediaStreams in the browser
I am using Web Audio API (with MediaRecorder or RecordRTC) to capture audio from the microphone.
Let's take the case of MediaRecorder (although it works the same for RecordRTC).
MediaRecorder's ...
0
votes
1
answer
63
views
Simple synthesizer code is working on Chromium, not on Firefox
I'm trying to figure out why this simple Web Audio synthesizer code is working in Chromium but not in Firefox. Could be a Firefox bug, or it could be that my code is not standard compliant and ...
0
votes
0
answers
34
views
How to change pitch and tempo in AudioWorklet?
I've made the following website, you can select any song and it will hopefully play when you click play btn. I used an AudioWorklet cause I was told createScriptProcessor which I had before might've ...
0
votes
1
answer
26
views
Get existing AudioContext in aframe
I'm trying to work with audio using the WebAudioAPI and aframe. I should be able to connect a new Convolver Node or any other AudioNode to the existing Audio Context created, if I understood correctly,...
0
votes
1
answer
34
views
Only first iteration is a valid webm file in mediarecorder dataavailable listener
So I am developing an audio recorder for the browser to transcribe text using Open AI whisper. However only the first iteration of MediaRecorder dataavailable is saved as a valid .webm file, then they ...
0
votes
0
answers
28
views
Audio playback crackles and has artefacts on mobile (SoundTouch js)
My phone is a Samsung note 10, and I've tested it on Chrome and Firefox. Let me know if it's just me but...
I've basically created the following website, I've put it on github. Basically you choose ...
0
votes
0
answers
33
views
MediaRecorder audiochunks includes previous recording
I've a piece of code for recording audio only and sending it to my server everytime a silence is registered.
This works fine for the first recording.
Every recording following afterwards attaches the ...
0
votes
0
answers
29
views
How do I store and retrieve hundreds of small .mp3 files for an online piano web app?
I'm making an online piano where I have .mp3 files for each pitch (e.g. A1.mp3, C4.mp3, etc). My directories are organized by instrument. Here's an example:
/Electric Piano
_ A1.mp3
- A2.mp3
- A3.mp3
....
2
votes
0
answers
44
views
Decoding failed for Safari browser while using audioContext.decodeAudioData
I have a Vue JS application in which I am playing an audio stream coming from a Websocket connection. The audio stream is coming continuously in chunks so I have implemented a logic to play the ...
0
votes
0
answers
58
views
NuxtJS and $fetch: How to fetch and play audio when first chunk is ready?
I have a Nuxt server route that returns streamable audio from a third party API. I am using $fetch on the client side to send a POST request to that Nuxt server route and return a readablestream.
How ...
0
votes
0
answers
22
views
I have problem with Sound Pitch in JavaScript, every time the code is run, the pitch is higher instead of the normal value and I don't know what to do
I am writing code to manipulate sound because I want to make a "simulator of standing on the street" (only sound for now), but every time the code is run, the pitch of the sound is higher ...
0
votes
0
answers
67
views
cannot play mp3 file. Uncaught (in promise) DOMException: The media resource indicated by the src attribute or assigned media provider object was not
When I press the play button, I get Uncaught (in promise) DOMException: The media resource indicated by the src attribute or assigned media provider object was not suitable.
I have tried everything ...
0
votes
0
answers
21
views
Is there a way to loopback all the audios on the webpage to an audio node?
I have tried $('video,audio') then create source nodes from these HTMLMediaElements.
If the element is a plain video/audio with src, it no longer outputs audio to any a-out device, and instead it is ...
0
votes
1
answer
39
views
MediaError code 4 - I can't play audio on Safari
I'm having a problem with playing audio on Safari browser. The audio is playing perfectly on Chrome/Firefox/Edge. But when I play the audio on Safari, I'm always getting MediaError Code 4. Below is ...
0
votes
1
answer
20
views
How to connect a bufferSource to Tone's Destination
With regular WebAudio, I can connect a bufferSource to destination like so:
const audioCtx = new AudioContext()
const bufferSource = audioCtx.createBufferSource()
bufferSource.connect(audioCtx....
0
votes
0
answers
33
views
How do I add tempo and pitch with JS
I am quite a beginner to JS, I know my way around some things, but nowhere near an expert, and I'm new to using libraries, so sorry if this is terrible on my part.
Anyway, I've created this website on ...
0
votes
1
answer
69
views
Audio from mic in Safari (Mac) unexpectedly diminishes in volume after several seconds
I am capturing audio from the computer mic in Safari. The audio I am capturing is of me humming a fixed pitch. For the first few seconds, the audio is recorded at the expected volume. After maybe 5-10 ...
1
vote
1
answer
53
views
Looping music with .play() .pause() button in HTML5-Canvas
I'm trying to loop music embedded in HTML5-Canvas with an onClick event listener but cannot find a method to make it loop. Audio is functional but only for a single loop. This is only meant to be ...
0
votes
0
answers
38
views
How can we concat two audios into one single audio?
I have two audio URLs(mp3). I want to concat these two audio into one single audio and use it in an HTML audio tag.
I have tried using window.AudioContext || window.webkitAudioContext Web API.
Here,
/*...
0
votes
0
answers
54
views
How to record an audio from microphone, change the playbackRate and save it?
I would like to record a voice from the microphone using HTML Web Audio API, change the playback rate and save it as a new blob or file.
I followed these suggestions on:
How to create an AudioBuffer ...
2
votes
1
answer
57
views
Is there a way to cache audio element requests without Service Workers?
I have a userscript where I'd like to cache audio files from audio elements. fetch() isn't viable here as I have to wait for it to fetch to get a blob out of it. Is there a way to use the audio ...
0
votes
0
answers
50
views
How schedule audiobuffer when dealing with 10 second chunks?
This is a follow up to this answer:
https://stackoverflow.com/a/26068642/73804
I am trying to smoothly play multiple short audio clips (and get the underlying bytes). My implementation fails because ...
0
votes
1
answer
27
views
Are Web Audio APIs viable for scheduling non-audio events?
Say I want something to happen after exactly 30 seconds. I've seen people claim that Web Audio can be used to achieve this due to its accurate timers. But I've never seen an example of how this could ...
-1
votes
1
answer
53
views
Failed to execute 'createMediaElementSource' on 'AudioContext'
I am getting Uncaught DOMException: Failed to execute 'createMediaElementSource' on 'AudioContext': HTMLMediaElement already connected previously to a different MediaElementSourceNode when I select ...
4
votes
1
answer
795
views
ios17 safari AudioContext (Web Audio API) problem
Since I upgraded to ios17 my AudioContext is not working on Safari.
I have a simple element that I connect a gain node through AudioContext. The audio loads the .mp3 file (remaining time is updated ...
1
vote
1
answer
76
views
Obtaining Current Time
I am trying to understand how can I obtain the current time of the audio while the audio is playing. So when the audio starts playing it will log 0 and at the end of play it will log the total ...
0
votes
0
answers
18
views
Storing and playing JS generated audio in an <audio> tag without recording
I'm messing around with Web Audio API trying to read out and play morse code but can't figure out if I'm missing something.
const dest = ctx.createMediaStreamDestination();
const recorder = new ...
0
votes
0
answers
23
views
Cannot access microphone when open link website from facebook
https://i.stack.imgur.com/cpSK7.png
const mediaDevices = navigator.mediaDevices || (navigator as any).webkitMediaDevices || (navigator as any).mozMediaDevices ||
(navigator as any).msMediaDevices;
...
3
votes
1
answer
63
views
Why does an extra event fire when two keys are held down and the first key is released?
This has been plaguing me for some time. I'm using the WebAudioAPI in Javascript to make a synthesizer. I have a keydown event that plays a sound and a keyup event that stops the sound. However, if I ...
0
votes
0
answers
16
views
Sound disappeared after playing for couple hours on iPhone14 (WebAudio API)
The HTML5 game I developed uses the WebAudio API to play sound effects,
and the sound played successfully at first.
However, after playing for couple hours, the sound started to have some noise, then ...
1
vote
0
answers
232
views
How to detect when user is speaking into microphone and when not, using HTML5 and Javascript?
I am working on a web application where I need to present user with the list of available microphones so that they can choose their preferred one and test that (like how google meet allows testing of ...
0
votes
0
answers
49
views
Unable to pass Multiple Audio Streams to AudioWorkletProcessor as inputs. (WebAudio API) (Twilio)
Given below is a React Hook File which implements some Audio Processing of the audio tracks of Local and Remote Participants in a Meeting Application using Twilio Video Services. Till now I have been ...
1
vote
0
answers
31
views
Web audio API - play two audio files syncronized with precise timing audio without buffering
I'm using react and i'm trying to play two audio files with perfect sync (let's say drums and guitar), iv'e tried to use <audio/> elements, loop on them and run play() function, but sometimes it'...
2
votes
0
answers
45
views
How to add Fade-in Fade-Out to a looping audio. Mozilla Web Audio API
I am making an audio editing plugin. One of the requirements is to loop the audio n number of times during playback. I have achieved this by using the src.loop = true attribute of the ...
0
votes
0
answers
58
views
Javascript Engine Simulator Module Not Producing Sound
I'm using a JS Engine Noise Simulator module here.
When I start it up, it all seems to work from the logs in the console, but when I open the page and press play, no sound comes through.
Here's some ...
0
votes
0
answers
27
views
Web Audio Player-Recorder in React
I just followed this tutorial https://blog.logrocket.com/building-audio-player-react/ to create a Web Audio Player in React.
I wonder how I could add a recording functionality, so that the user could ...
0
votes
1
answer
191
views
MediaRecorder Recording MediaStream With AudioContext Inconsistently Triggering Stop & OnDataAvailable Events On Mobile
I have code that records the stream of a video manipulated and displayed on a canvas element and combines it with the AudioContext stream of the same video to give it sound.
It works 100% of the time ...
0
votes
0
answers
293
views
Play audio from a ReadableStream
A request to a server returns an audio file streamed back as a ReadableStream.
The server might sometimes be slow, and this is why streaming is preferred over sending the whole file at once.
How would ...
2
votes
1
answer
64
views
Reverse Audio in JavaScript/Angular
I want to implement an audio player's rewind functionality so than I hear the audio playing in fast rewind while I'm holding the rewind button down.
I have an AudioBuffer and I am reversing it, but ...
0
votes
1
answer
159
views
WebAudioWorklet in webassembly Shared Array Buffer not defined
I ma trying to understand how to compile an Audio Worklet in webassembly using the Wasm Audio Worklets API of the emscripten.
Using the code listed in the tutorial on the API reference here and ...
0
votes
1
answer
82
views
Add a three.js AudioAnalyser to an HLS Stream
Is it possible to add a three.js AudioAnalyser (or WebAPI AnalyserNode) to an Hls audio stream? This is what I have so far and average frequency always returns 0.
let audioContext = new (...
1
vote
1
answer
246
views
While streaming audio chunk by chunk it has pause interval between chunks
I am currently working on implementing a streaming audio feature, and I've encountered an issue related to merging audio buffers using the AudioContext. My goal is to fetch 5-second audio chunks and ...
2
votes
1
answer
1k
views
How to properly handle streaming audio coming from Elevenlabs Streaming API?
Hi I have a front end application in react js. I using Elevenlabs to convert the text into audio. I am using streaming API of Elevenlabs so that I don't have to wait for the whole audio and can start ...