BaseAudioContext: state property
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021.
Thestate read-only property of theBaseAudioContextinterface returns the current state of theAudioContext.
In this article
Value
A string. Possible values are:
closedThe audio context has been closed (with the
AudioContext.close()method.)interruptedThe audio context has been interrupted by an occurrence outside the control of the web app.
runningThe audio context is running normally.
suspendedThe audio context has been suspended (with the
AudioContext.suspend()method.)
Description
Thestate property of an audio context is used to expose its current operational state. This is normally done by querying thestate inside astatechange event handler so that changes in state can be responded to appropriately.
Therunning andclosed values are self-explanatory — they indicate that the audio context is either running normally, or closed (via theAudioContext.close() method).
Theinterrupted andsuspended states both represent a "paused" state that can later be resumed, but they differ in terms of what they signify:
- The
suspendedstate indicates that the audio context was paused in response to a user action inside the web app, by running theAudioContext.suspend()method inside aclick(or similar) event handler. In this case, the context would be unpaused by running theAudioContext.resume()method. - The
interruptedstate indicates that the audio context was paused in response to an interruption outside the control of the web app. In this case, the browser decides when to pause and unpause the app. The web app can then handle theinterruptedstate appropriately, for example by pausing an audio stream to avoid wasting resources while an app is not being used.
Interruptions that may trigger theinterrupted state can include:
- A conferencing or phone app on the same system requiring exclusive access to the device's audio hardware.
- The user closing their laptop.
- API features designed to initiate or respond to audio interruptions.
Note:How theinterrupted state is triggered may vary between browsers.
Note also the potential for transitions between theinterrupted andsuspended states:
- If
suspend()is called on an audio context during an interruption (stateisinterrupted), the state will transition tosuspendedimmediately. - If
resume()is called on asuspendedaudio context during an interruption, the state will transition tointerruptedimmediately. - If an interruption happens while the audio context is
suspended, the context will not transition tointerrupted. This transition won't happen unlessresume()is called on the context (as outlined by the previous point). This choice was made to avoid exposing too much device information to web pages - for example, logging every time the laptop is closed could be a privacy issue.
Examples
>Handling state changes
The following snippet is taken from ourAudioContext states demo (see it running live.) Theonstatechange handler is used to log thecurrent state to the console every time it changes.
audioCtx.onstatechange = () => { console.log(audioCtx.state);};Resuming interrupted play states in iOS Safari
In iOS Safari, when a user leaves the page (e.g., switches tabs, minimizes the browser, orturns off the screen)the audio context's state changes to "interrupted" and needs to be resumed. For example:
function play() { if (audioCtx.state === "interrupted") { audioCtx.resume().then(() => play()); return; } // rest of the play() function}Specifications
| Specification |
|---|
| Web Audio API> # dom-baseaudiocontext-state> |