Limited support 一部のブラウザのみ対応。使用時はサポート状況を確認すること。

Web MIDI

安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

Web MIDI API の MIDIAccess インターフェイスは、MIDI の入力デバイスや出力デバイスを列挙するメソッドと、それらのデバイスへのアクセスを得るメソッドを提供します。

EventTarget MIDIAccess

埋め込み

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
MIDIAccess
43
79
108
43
inputs

MIDIAccess の読み取り専用プロパティ inputs は、任意の利用可能な MIDI 入力ポートへのアクセスを提供します。
43
79
108
43
outputs

MIDIAccess インターフェイスの読み取り専用プロパティ outputs は、任意の利用可能な MIDI 出力ポートへのアクセスを提供します。
43
79
108
43
statechange_event

MIDIAccess インターフェイスの statechange イベントは、新しい MIDI ポートが追加されるか、既存のポートの状態が変わると発火します。
43
79
108
43
sysexEnabled

MIDIAccess インターフェイスの読み取り専用プロパティ sysexEnabled は、現在の MIDIAccess インスタンスでシステムエクスクルーシブへの対応が有効かどうかを表します。
43
79
108
43
MIDIConnectionEvent

Web MIDI API の MIDIConnectionEvent インターフェイスは、MIDIAccess インターフェイスの MIDIAccess.statechangeevent イベントおよび MIDIPort インターフェイスの MIDIPort.statechangeevent イベントに渡されるイベントです。これは、新しいポートが利用可能になった時と、利用可能だったポートが利用不可能になった時に毎回発生します。たとえば、MIDI デバイスがコンピューターに接続されたり切断されたりするたびに、このイベントが発火します。
43
79
108
43
MIDIConnectionEvent

MIDIConnectionEvent() コンストラクターは、新しい MIDIConnectionEvent オブジェクトを生成します。イベントは新しいポートが利用可能になった時に生成され、オブジェクトが MIDIAccess.statechange_event イベントに渡されるので、通常このコンストラクターは使用されません。
43
79
108
43
port

MIDIConnectionEvent インターフェイスの読み取り専用プロパティ port は、切断または接続されたポートを返します。
43
79
108
43
MIDIInput

Web MIDI API の MIDIInput インターフェイスは、MIDI 入力ポートからメッセージを受信します。
43
79
108
43
midimessage_event

Web MIDI API の midimessage イベントは、この MIDIInput に対応する MIDI ポートで 1 個以上の MIDI メッセージの受信が完了した時発火します。受信したメッセージが格納された MIDIMessageEvent のインスタンスがイベントハンドラーに渡されます。
43
79
108
43
MIDIInputMap

Web MIDI API の読み取り専用インターフェイス MIDIInputMap は、現在利用可能な MIDI 入力ポートの集合を提供します。
43
79
108
43
@@iterator

[シンボル.イテレータ］
43
79
108
43
entries
43
79
108
43
forEach
43
79
108
43
get
43
79
108
43
has
43
79
108
43
keys
43
79
108
43
size
43
79
108
43
values
43
79
108
43
MIDIMessageEvent

Web MIDI API の MIDIMessageEvent インターフェイスは、MIDIInput インターフェイスの MIDIInput.midimessage_event イベントに渡されるイベントを表します。midimessage イベントは、MIDIInput が表すデバイスから MIDI メッセージが送られてくるたびに発火します。たとえば、MIDI キーボードのキーが押された時、ノブが回された時、スライダーが動かされた時などです。
43
79
108
43
data

MIDIMessageEvent インターフェイスの読み取り専用プロパティ data は、1 個の MIDI メッセージの MIDI データバイト列を返します。
43
79
108
43
MIDIMessageEvent

MIDIMessageEvent() コンストラクターは、新しい MIDIMessageEvent オブジェクトを生成します。イベントは MIDIInput が 1 個以上の MIDI メッセージの受信を完了した時に生成されるため、通常このコンストラクターは使用されません。
43
79
108
43
MIDIOutput

Web MIDI API の MIDIOutput インターフェイスは、出力デバイスのキューにメッセージを追加するメソッドと、メッセージのキューをクリアするメソッドを提供します。
43
79
108
43
clear

MIDIOutput インターフェイスの clear() メソッドは、出力デバイスへの送信待ち中のメッセージのキューをクリアします。
108
send

MIDIOutput インターフェイスの send() メソッドは、対応する MIDI ポートに送信するメッセージをキューに追加します。メッセージはすぐに送信することも、省略可能なタイムスタンプを用いて送信を遅延させることもできます。
43
79
108
43
MIDIOutputMap

Web MIDI API の読み取り専用インターフェイス MIDIOutputMap は、現在利用可能な MIDI 出力ポートの集合を提供します。
43
79
108
43
@@iterator

[シンボル.イテレータ］
43
79
108
43
entries
43
79
108
43
forEach
43
79
108
43
get
43
79
108
43
has
43
79
108
43
keys
43
79
108
43
size
43
79
108
43
values
43
79
108
43
MIDIPort

Web MIDI API の MIDIPort インターフェイスは、MIDI の入力ポートや出力ポートを表します。
43
79
108
43
close

MIDIPort インターフェイスの close() メソッドは、この MIDIPort に接続された MIDI デバイスへのアクセスを利用不可能にします。
43
79
108
43
connection

MIDIPort インターフェイスの読み取り専用プロパティ connection は、このポートの接続状態を返します。
43
79
108
43
id

MIDIPort インターフェイスの読み取り専用プロパティ id は、ポートの一意な ID を返します。
43
79
108
43
manufacturer

MIDIPort インターフェイスの読み取り専用プロパティ manufacturer は、ポートの製造元を返します。
43
79
108
43
name

MIDIPort インターフェイスの読み取り専用プロパティ name は、ポートのシステム名を返します。
43
79
108
43
open

MIDIPort インターフェイスの open() メソッドは、この MIDIPort に接続された MIDI デバイスを明示的に利用可能にします。
43
79
108
43
state

MIDIPort インターフェイスの読み取り専用プロパティ state は、ポートの状態を返します。
43
79
108
43
statechange_event

MIDIPort インターフェイスの statechange イベントは、ポートが開いた状態から閉じた状態に、または閉じた状態から開いた状態に変化した時発火します。
43
79
108
43
type

MIDIPort インターフェイスの読み取り専用プロパティ type は、ポートの種類を返し、この MIDI ポートが入力ポートなのか出力ポートなのかを表します。
43
79
108
43
version

MIDIPort インターフェイスの読み取り専用プロパティ version は、ポートのバージョンを返します。
43
79
108
43
requestMIDIAccess

Navigator インターフェイスの requestMIDIAccess() メソッドは、ユーザーのシステム上の MIDI デバイスへのアクセスの要求を表す Promise を返します。このメソッドは MIDI デバイスのアクセス、列挙、操作の方法を提供する Web MIDI API の一部です。
43
79
108
43
requestMIDIAccess (secure context required)

安全なコンテキストが必要
43
79
108
43
permission_midi

midi`の許可
43
79
110
43
その他
html.elements.iframe.allow.midi
64
79
74
64
http.headers.Permissions-Policy.midi
実験的

HTTP の Permissions-Policy ヘッダーにおける midi ディレクティブは、現在の文書が Web MIDI API を使用することを許可するかどうかを制御します。
88
88
88
1+対応 (バージョン) 未対応 ※注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)
注釈 2件
制限事項
  • このブラウザでは部分的にしか実装されていません
実装メモ
  • イベントハンドラ `onstatechange` はサポートされているが、イベントは発生しない。バグ 1802149 を参照のこと。
注釈 1件
実装メモ
  • APIへのアクセスは、サイトパーミッションアドオン（ユーザープロンプト）、セキュアコンテキスト、および`Permission Policy: midi`のインストールによって制限される。

基本構文

JAVASCRIPT 
const midi = await navigator.requestMIDIAccess();
for (const input of midi.inputs.values()) {
  input.onmidimessage = (e) => {
    console.log('MIDI:', e.data);
  };
}

実務での使いどころ

  • Web MIDI の活用

    安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

注意点

  • 一部のブラウザでのみ対応。使用前にブラウザサポートを確認すること。

アクセシビリティ

  • スクリーンリーダーでの読み上げを確認すること。

参考リンク