This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The setActionHandler()
property of the MediaSession
interface sets an event handler for a media session action.
Syntax
navigator.mediaSession.setActionHandler(type, callback)
Parameters
- type
- A string representing an action type to listen for. It will be one of
play
,pause
,seekbackward
,seekforward
,previoustrack
, ornexttrack
. - callback
- Indicates the function to call when the specified action type is invoked. This is a void function, with no parameters.
Returns
void
Examples
The following example creates a new media session and assigns action handlers to it:
if ('mediaSession' in navigator){ navigator.mediaSession.metadata = new MediaMetadata({ title: "Podcast Episode Title", artist: "Podcast Host", album: "Podcast Name", artwork: [{src: "podcast.jpg"}] }); navigator.mediaSession.setActionHandler('play', function() {}); navigator.mediaSession.setActionHandler('pause', function() {}); navigator.mediaSession.setActionHandler('seekbackward', function() {}); navigator.mediaSession.setActionHandler('seekforward', function() {}); navigator.mediaSession.setActionHandler('previoustrack', function() {}); navigator.mediaSession.setActionHandler('nexttrack', function() {}); }
This example uses appropriate action handlers to allow seeking in either direction through the playing media.
let skipTime = 10 // Time to skip in seconds navigator.mediaSession.setActionHandler('seekbackward', evt => { // User clicked "Seek Backward" media notification icon. audio.currentTime = Math.max(audio.currentTime - skipTime, 0) }) navigator.mediaSession.setActionHandler('seekforward', evt => { // User clicked "Seek Forward" media notification icon. audio.currentTime = Math.min(audio.currentTime + skipTime, audio.duration) })
Specifications
Specification | Status | Comment |
---|---|---|
Media Session Standard The definition of 'setActionHandler()' in that specification. |
Editor's Draft | Initial definition. |
Browser Compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | No support | ? | ? | No support | ? |
Feature | Android Webview | Chrome for Android | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|---|
Basic support | No support | 57 | ? | ? | ? | No support | ? |
Document Tags and Contributors
Tags:
Contributors to this page:
jpmedley,
bunnybooboo
Last updated by:
jpmedley,