Start · Sprachen · JavaScript · Referenz · new MIDIMessageEvent()

new MIDIMessageEvent()

Methode

Erzeugt ein neues <code>MIDIMessageEvent</code>-Objekt, das eine MIDI-Nachricht als <code>Uint8Array</code> in der Eigenschaft <code>data</code> enthält.

seit JavaScript Web MIDI API – Chromium-Browser, Firefox 108+ (kei Kategorie: webapi

Signatur

new MIDIMessageEvent(type, options)

Beschreibung

Der Konstruktor MIDIMessageEvent() erzeugt ein Ereignisobjekt vom Typ MIDIMessageEvent. Solche Ereignisse feuert der Browser normalerweise selbst an einem MIDIInput, sobald ein angeschlossenes MIDI-Gerät eine Nachricht sendet, zum Beispiel beim Drücken einer Taste (Note On), beim Loslassen (Note Off) oder beim Drehen eines Reglers (Control Change).

Selbst aufrufen muss man den Konstruktor selten. Er ist vor allem für diese Fälle nützlich:

  • Tests und Simulation: MIDI-Eingaben nachbilden, ohne dass ein echtes Gerät angeschlossen ist.
  • Virtuelle Instrumente: Eine Bildschirm-Klaviatur kann dieselben Ereignisse erzeugen wie ein Hardware-Controller. So bleibt die Verarbeitungslogik für beide Quellen gleich.
  • Weiterleitung: Eingehende Nachrichten an einen eigenen EventTarget weitergeben.

Die eigentlichen MIDI-Bytes übergibt man im Optionsobjekt unter data als Uint8Array. Das erste Byte ist das Status-Byte (Nachrichtentyp und Kanal), danach folgen die Datenbytes. Ein Note On auf Kanal 1 für das mittlere C mit Anschlagstärke 100 lautet zum Beispiel [0x90, 60, 100].

Parameter

Name Typ Default Beschreibung
$type Pflicht string Name des Ereignisses. Für MIDI-Nachrichten ist das üblicherweise "midimessage".
$options object {} Optionsobjekt. Neben den Feldern von EventInit (bubbles, cancelable, composed) gibt es data: ein Uint8Array mit den rohen MIDI-Bytes der Nachricht.

Rückgabewert

Typ
MIDIMessageEvent
Beschreibung
Ein neues MIDIMessageEvent-Objekt. Die Eigenschaft data enthält die übergebenen Bytes.

Beispiele

Einfaches Note-On-Ereignis erzeugen

// Note On, Kanal 1, Note 60 (mittleres C), Anschlagstärke 100
const event = new MIDIMessageEvent('midimessage', {
  data: new Uint8Array([0x90, 60, 100])
});

console.log(event.type);
console.log(Array.from(event.data));
midimessage [144, 60, 100]

Virtuelle Klaviatur und Hardware mit demselben Handler verarbeiten

const midiBus = new EventTarget();

const handleMidi = (event) => {
  const [status, note, velocity] = event.data;
  const command = status & 0xf0;
  if (command === 0x90 && velocity > 0) {
    console.log(`Note an: ${note} (Stärke ${velocity})`);
  } else if (command === 0x80 || (command === 0x90 && velocity === 0)) {
    console.log(`Note aus: ${note}`);
  }
};

midiBus.addEventListener('midimessage', handleMidi);

// Bildschirmtaste simuliert eine MIDI-Eingabe
const playVirtualNote = (note) => {
  midiBus.dispatchEvent(new MIDIMessageEvent('midimessage', {
    data: new Uint8Array([0x90, note, 90])
  }));
  setTimeout(() => {
    midiBus.dispatchEvent(new MIDIMessageEvent('midimessage', {
      data: new Uint8Array([0x80, note, 0])
    }));
  }, 300);
};

playVirtualNote(64);
Note an: 64 (Stärke 90) Note aus: 64

Echte Eingaben an den eigenen Bus weiterleiten

const midiBus = new EventTarget();
midiBus.addEventListener('midimessage', (e) => {
  console.log('Bytes:', Array.from(e.data));
});

const access = await navigator.requestMIDIAccess();
for (const input of access.inputs.values()) {
  input.addEventListener('midimessage', (e) => {
    // Kopie erzeugen und weiterreichen
    midiBus.dispatchEvent(new MIDIMessageEvent('midimessage', {
      data: new Uint8Array(e.data)
    }));
  });
}
Bytes: [144, 60, 100] (beim Tastendruck am Gerät)

// Wichtig · Fallstricke

  • Browser-Unterstützung: Die Web MIDI API gibt es in Chrome, Edge, Opera und in Firefox ab Version 108. Safari unterstützt sie nicht. Vorher prüfen: typeof MIDIMessageEvent !== 'undefined'.
  • Sicherer Kontext: Die API steht nur über HTTPS (oder localhost) zur Verfügung. Für navigator.requestMIDIAccess() ist außerdem eine Berechtigung nötig, bei SysEx-Zugriff ({ sysex: true }) mit gesonderter Nachfrage.
  • Kein Senden an Geräte: Ein selbst erzeugtes Ereignis erreicht kein Hardware-Gerät. Zum Senden dient MIDIOutput.send(). Ein dispatchEvent() an einem echten MIDIInput erreicht zwar die dort registrierten Listener, aber nicht das Gerät. Das Ereignis hat außerdem isTrusted === false.
  • Datentyp: data sollte ein Uint8Array sein. Werte über 255 werden abgeschnitten. Note On mit der Anschlagstärke 0 bedeutet nach MIDI-Konvention „Note aus“.
  • Wird data weggelassen, ist die Eigenschaft nicht mit Nutzdaten gefüllt. Der Handler sollte daher vor dem Zerlegen der Bytes prüfen, ob event.data vorhanden ist und die nötige Länge hat.