アホみたいなWeb MIDI APIラッパーを更新してたらいろいろと気づいた

メリークリスマース！

↑謎のMIDI楽器たち

前ふり

普段 Web MIDI APIでは主に「リアル金属音を鳴らす」という偏った活動をしてる @tadfmacです。

アホなスライド

勢いでアドベントカレンダーに登録してしまった！
どうしよう！ネタはない！時間もない！

というわけで、やってみて起こったことをつらつらと書きます。すいません...

やってみたこと。 poormidi.js -> pomidi.js

アホみたいなWeb MIDI APIの Wrapper ですが、さすがにいろいろアレなので、さらにアホみたいに書けるように進化（！？）させようと企んでいます。

まだ githubにはpushしてませんけど、こちらに置いてあります。

使い方

こんな感じで書けるようになります。

main.js

(async ()=>{
  var midi = await new pomidi();
  midi.sendNoteOn(30);
  await midi.wait(100);
  midi.sendNoteOn(40);
  await midi.wait(100);
  midi.sendNoteOn(50);
})();

かんたん！
アホみたいなケースにしか使えなさそうな気もしますが遊んでください！

気づいたこと 1. Chrome 63から Cross-Origin iframes で MIDIの利用が制限される?

jsFiddle 便利ですね！
さきほどの pomidi.js もjsfiddleでテストしてました。

こんな感じのスクリプト書いてWindow 2つ開いて遊ぶ感じです。

• MIDI送る方
• MIDI受ける方

MacでIACを有効にしておくと Window間でMIDI渡せるよー

しかし！
コンソールにこんなメッセージが！

ええ！？どういうこと！？
Web MIDI APIなんか怒られてる！？

なんか見覚えあるような....と思ったら、ここ↓に書いてありました。

MIDIだけでなく、getUserMedia も同じように制限されるようになる模様。

まぁ、iframe 経由で Web MIDI API 使うなんてのは普通はやらないので影響ないわけですが、jsfiddle で外部jsファイルを読み込むように書いたら、たまたまそういう構造になっていてひっかかった。という話でした。jsfiddle 使ってなかったら気づかなかった気がする。

気づいたこと 2. なんかエラー?

というか、requestMIDIAccess()で見慣れないエラーもでるようになってるぞ。Chrome 62。
InvalidStateError: Platform dependent initialization failed.

なんだ？これ。
ちょっとしらべてみると、issueで報告されているようです。

どうやら、chrome://flags/#enable-midi-manager-dynamic-instantiation が default になってると、起こることがある? という雰囲気。(ちゃんと読んでないw)

悩まず disable に。→なんとなく起こらなくなった模様。ノープロブレム。

まとめ。

やはり Web MIDI APIおもしろい。

ChromeではWebUSBも実装されたので、USB経由でいろいろやれる可能性は広がったけど今のところMIDIに合わせこんでいろいろやる方が自分にはちょうどいい。

というわけで、他のブラウザでも早く使いたいので、Edgeに Web MIDI API実装してもらえるようお願いしよう！