MIDIPort.state — Eigenschaft · JavaScript-Referenz

Signatur

MIDIPort.state

Beschreibung

Die schreibgeschützte Eigenschaft state eines MIDIPort-Objekts (also eines MIDIInput oder MIDIOutput) gibt an, ob das zugehörige Gerät gerade verfügbar ist. Der Wert ist einer von zwei Strings:

"connected" – das Gerät ist angeschlossen und für das System erreichbar.
"disconnected" – das Gerät wurde entfernt oder ist nicht mehr erreichbar. Das Port-Objekt bleibt aber in der MIDIAccess-Map, solange Ihre Seite es bereits geöffnet hatte.

Wichtig ist der Unterschied zu MIDIPort.connection: state beschreibt die Hardware, connection dagegen, ob Ihre Anwendung den Port geöffnet hat ("open", "closed" oder "pending"). Ein Port kann also z. B. gleichzeitig state === "disconnected" und connection === "pending" sein. Das bedeutet: Er war geöffnet, das Gerät wurde abgezogen, und beim erneuten Anstecken öffnet der Browser ihn automatisch wieder.

In der Praxis werten Sie state vor allem im statechange-Event aus, das auf dem MIDIAccess-Objekt und auf dem einzelnen Port ausgelöst wird. So können Sie Geräteauswahl-Listen aktualisieren oder Nutzer darüber informieren, dass ein Keyboard oder Controller eingesteckt bzw. entfernt wurde.

Rückgabewert

Typ

"connected" | "disconnected"

Beschreibung

Ein String, der den Geräte-Zustand des Ports beschreibt (Aufzählungstyp MIDIPortDeviceState).

Beispiele

Zustand aller Ports auflisten

const access = await navigator.requestMIDIAccess();

for (const port of [...access.inputs.values(), ...access.outputs.values()]) {
  console.log(`${port.type}: ${port.name} → ${port.state} (${port.connection})`);
}

input: Arturia KeyStep 37 → connected (closed) output: Arturia KeyStep 37 → connected (closed)

Auf Anstecken und Abziehen reagieren

const access = await navigator.requestMIDIAccess();

access.addEventListener('statechange', (event) => {
  const { port } = event;
  if (port.state === 'connected') {
    console.log(`Neues Gerät: ${port.name} (${port.type})`);
  } else {
    console.warn(`Gerät getrennt: ${port.name}`);
  }
});

Neues Gerät: nanoKONTROL2 (input) Gerät getrennt: nanoKONTROL2

Nur verbundene Ausgänge für ein Auswahlmenü

const updateOutputSelect = (access, select) => {
  select.replaceChildren();
  for (const output of access.outputs.values()) {
    if (output.state !== 'connected') continue;
    select.append(new Option(output.name, output.id));
  }
};

const access = await navigator.requestMIDIAccess();
const select = document.querySelector('#midi-out');
updateOutputSelect(access, select);
access.onstatechange = () => updateOutputSelect(access, select);

Vor dem Senden prüfen

const sendNoteOn = (output, note = 60, velocity = 100) => {
  if (output.state !== 'connected') {
    console.warn(`${output.name} ist nicht verbunden – Nachricht verworfen.`);
    return false;
  }
  output.send([0x90, note, velocity]);
  return true;
};

const access = await navigator.requestMIDIAccess();
const [firstOut] = access.outputs.values();
if (firstOut) sendNoteOn(firstOut);

// Wichtig · Fallstricke

Nicht mit connection verwechseln: state sagt nichts darüber, ob der Port geöffnet ist. Ein "connected"-Port kann trotzdem connection === "closed" haben. Mit port.open() öffnen Sie ihn ausdrücklich. Auch das Setzen von onmidimessage oder ein send()-Aufruf öffnet ihn implizit.
Schreibgeschützt: Eine Zuweisung an state wird ignoriert (im Strict Mode gibt es einen TypeError).
Getrennte Ports bleiben sichtbar: Ein zuvor geöffneter Port bleibt nach dem Abziehen mit "disconnected" in access.inputs/outputs. Filtern Sie ihn in Auswahllisten heraus.
Kompatibilität und Sicherheit: Die Web MIDI API funktioniert nur in sicheren Kontexten (HTTPS) und braucht eine Berechtigung des Nutzers. Chromium-Browser und Firefox (ab 108) unterstützen sie, Safari nicht. Prüfen Sie vorher mit 'requestMIDIAccess' in navigator, ob die API vorhanden ist.
Das statechange-Event kann bei einem einzigen Gerät mehrfach feuern: einmal pro Ein- und Ausgang und zusätzlich bei Änderungen von connection. Ihr Handler sollte deshalb mehrfache Aufrufe verkraften (idempotent sein).

Siehe auch

MIDIPort MIDIPort.connection MIDIAccess Navigator.requestMIDIAccess() MIDIPort.open() MediaSource.handle