Die Web MIDI API verbindet mit und interagiert mit Musical Instrument Digital Interface (MIDI) Geräten.

Die Schnittstellen befassen sich mit den praktischen Aspekten des Sendens und Empfangens von MIDI-Nachrichten.Daher kann die API sowohl für musikalische als auch nicht-musikalische Anwendungen mit jedem MIDI-Gerät, das mit Ihrem Computer verbunden ist, verwendet werden.

Schnittstellen

MIDIInputMap

Repräsentiert alle verfügbaren MIDI-Eingangsanschlüsse.

MIDIOutputMap

Repräsentiert alle verfügbaren MIDI-Ausgangsanschlüsse.

MIDIAccess

Bietet die Methoden, um Eingabe- und Ausgabegeräte aufzulisten und um auf ein einzelnes Gerät zuzugreifen.

MIDIPort

Repräsentiert einen einzelnen MIDI-Anschluss.

MIDIInput

Bietet eine Methode zum Umgang mit MIDI-Nachrichten von einem Eingangsanschluss.

MIDIOutput

Wartet Nachrichten zur verbundenen MIDI-Schnittstelle. Nachrichten können sofort oder nach einer angegebenen Verzögerung gesendet werden.

MIDIMessageEvent

Das Ereignis, das an dasMIDIInputmidimessage Ereignis übergeben wird.

MIDIConnectionEvent

Das Ereignis, das an dieMIDIAccessstatechange undMIDIPortstatechange Ereignisse übergeben wird, wenn ein Anschluss verfügbar oder nicht verfügbar wird.

Sicherheitsanforderungen

Der Zugriff auf die API wird durch Aufrufen der Methodenavigator.requestMIDIAccess() angefordert.

• Die Methode muss in einemsicheren Kontext aufgerufen werden.
• Der Zugriff kann durch diemidi HTTPPermission Policy eingeschränkt sein.
• Der Benutzer muss explizit die Erlaubnis zur Nutzung der API über einen benutzerspezifischen Mechanismus erteilen oder zuvor die Erlaubnis erteilt haben.Beachten Sie, dass, wenn der Zugriff durch eine Permission Policy verweigert wird, dieser nicht durch eine Benutzergenehmigung erteilt werden kann.

Der Berechtigungsstatus kann mit derPermissions API Methodenavigator.permissions.query() abgefragt werden, indem ein Berechtigungsdeskriptor mit dermidi-Berechtigung und der (optional)sysex-Eigenschaft übergeben wird:

navigator.permissions.query({ name: "midi", sysex: true }).then((result) => {  if (result.state === "granted") {    // Access granted.  } else if (result.state === "prompt") {    // Using API will prompt for permission  }  // Permission was denied by user prompt or permission policy});

Beispiele

Zugriff auf den MIDI-Anschluss erlangen

Die Methodenavigator.requestMIDIAccess() gibt ein Versprechen zurück, das zu einemMIDIAccess Objekt aufgelöst wird, das dann verwendet werden kann, um auf ein MIDI-Gerät zuzugreifen.Die Methode muss in einem sicheren Kontext aufgerufen werden.

let midi = null; // global MIDIAccess objectfunction onMIDISuccess(midiAccess) {  console.log("MIDI ready!");  midi = midiAccess; // store in the global (in real usage, would probably keep in an object instance)}function onMIDIFailure(msg) {  console.error(`Failed to get MIDI access - ${msg}`);}navigator.requestMIDIAccess().then(onMIDISuccess, onMIDIFailure);

Eingaben und Ausgaben auflisten

In diesem Beispiel werden die Listen der Eingabe- und Ausgangsanschlüsse abgerufen und in die Konsole gedruckt.

function listInputsAndOutputs(midiAccess) {  for (const entry of midiAccess.inputs) {    const input = entry[1];    console.log(      `Input port [type:'${input.type}']` +        ` id:'${input.id}'` +        ` manufacturer:'${input.manufacturer}'` +        ` name:'${input.name}'` +        ` version:'${input.version}'`,    );  }  for (const entry of midiAccess.outputs) {    const output = entry[1];    console.log(      `Output port [type:'${output.type}'] id:'${output.id}' manufacturer:'${output.manufacturer}' name:'${output.name}' version:'${output.version}'`,    );  }}

MIDI-Eingaben handhaben

Dieses Beispiel druckt alle MIDI-Eingabenachrichten in die Konsole.

function onMIDIMessage(event) {  let str = `MIDI message received at timestamp ${event.timeStamp}[${event.data.length} bytes]: `;  for (const character of event.data) {    str += `0x${character.toString(16)} `;  }  console.log(str);}function startLoggingMIDIInput(midiAccess) {  midiAccess.inputs.forEach((entry) => {    entry.onmidimessage = onMIDIMessage;  });}

Spezifikationen

Browser-Kompatibilität

api.Navigator.requestMIDIAccess

http.headers.Permissions-Policy.midi

api.Permissions.permission_midi

Siehe auch

• Einführung in Web MIDI
• Musik im Browser machen