Access to MIDI devices now requires user permission

François Beaufort
François Beaufort
GitHub

Musical Instrument Digital Interface (MIDI) is a standard way for electronic musical instruments, hardware, and computers to communicate. The Web MIDI API allows websites to control virtual synthesizers, drum machines, or other instruments by connecting to the user's MIDI keyboard or controller.

Browser Support

  • 43
  • 79
  • 108
  • x

Source

Due to security concerns to freely access connected MIDI devices with the Web MIDI API, the W3C Audio Working Group has requested an explicit permission requirement for all MIDI API usage in the Web MIDI specification. This change, previously in place only for advanced MIDI usage (SysEx messages) in Chrome, now extends to standard MIDI interactions as well.

This means the entire Web MIDI API is now gated behind a permission prompt. This change is rolling out gradually starting in Chrome 124.

Screenshot of Web MIDI permission prompt in Chrome.
Web MIDI permission prompt in Chrome.

The following code shows you how to handle the permission prompt triggered by calling navigator.requestMIDIAccess() when access has not been granted by the user already.

try {
  // Prompt user to access MIDI devices.
  const access = await navigator.requestMIDIAccess();
  // Get lists of available MIDI controllers...

} catch (error) {
  if (error.name === "SecurityError") {
    // The website is not allowed to control and reprogram MIDI devices.
  }
}

Request SysEx messages support with navigator.requestMIDIAccess({ sysEx: true }) only if your website absolutely needs this feature. Chrome permission prompt strings might change in the future.

Testing

This change is gradually rolling out in Chrome 124. You may need to run Chrome with the --enable-features=BlockMidiByDefault command-line switch to enable it locally on your device.

Test this change on the https://permission.site website by clicking the "MIDI" and "MIDI + SysEx" buttons.

Browser support

Access to MIDI devices requires user permission in both Chrome and Firefox browsers.

Feedback

The Chrome team and the web standards community want to hear about your experiences with this change. Provide feedback by commenting on existing or filing new GitHub issues.

Acknowledgements

Thanks to Michael Wilson for reviewing this post.