如何将 Web Midi API 连接到本机应用程序（如 Ableton live）

Question

[如果有更好的地方可以问这个问题，请告诉我！]

注意：我在 Mac。

我已经使用 Web MIDI API 成功地将 MIDI 键盘连接到我的浏览器 (Chrome)。

我想知道我是否也可以连接应用程序（如 Ableton Live），以便当 Ableton 输出 MIDI 消息时，这些消息可以被浏览器接收？

我看到的选项：

将 Midi 从 Ableton 发送到我的 MIDI 键盘，然后将它们转发到 Web MIDI API（任何人都可以阐明如何设置它吗？）
使用 Mac OS 中的 IAC（应用程序间通信）驱动程序，"allows you to create virtual MIDI cables between applications inside the box, so to speak." 我不知道如何设置它，因为 'web midi api'没有出现在 Midi Studio 中。

我更喜欢选项 2，这样在没有物理 MIDI 设备的情况下它也可以工作，但我也很乐意了解选项 1 是否可以工作！

感谢您对此的任何意见！

Answer 1

我发现 Web MIDI API 的文档有点混乱，所以我尝试了 webmidi（它建立在 Web MIDI API 之上，所以它所做的一切也应该可以使用 "raw" API 来实现。

要接收 MIDI 消息，这对我有用：

WebMidi.enable(function(err) {
  if (err) throw err;
  console.log("WebMidi enabled!");
  WebMidi.getInputByName('IAC Driver Bus 1').addListener('noteon', 'all', function(e) {
    console.log('note on', e);
  });
});

在 Ableton 中，"Midi To" 需要指向 IAC 设备（如果没有显示，您可能需要打开 MIDI 首选项并启用它作为输出设备）：

警告：我发现这只适用于没有任何乐器的 MIDI 音轨（参见 this page）。

编辑：我假设该设备在您的 Mac 上的命名相似，否则这是我用来枚举输入和输出设备的代码：

WebMidi.enable(function(err) {
  if (err) throw err;
  WebMidi.inputs.forEach(input => {
    console.log('- id  :', input.id);
    console.log('- name:', input.name);
    console.log('- manu:', input.manufacturer);
    console.log('- conn:', input.connection);
    console.log('---');
  });
  console.log('outputs:', WebMidi.outputs);
  WebMidi.outputs.forEach(output => {
    console.log('- id  :', output.id);
    console.log('- name:', output.name);
    console.log('- manu:', output.manufacturer);
    console.log('- conn:', output.connection);
    console.log('---');
  });
});

Answer 2

为了在 OSX 上将来自 Ableton 的 MIDI 事件发送到 Web MIDI API，您需要执行以下操作：

1) 运行 built-in OSX 应用程序名为 'Audio MIDI Setup'。 Select 'MIDI Studio'。双击 'IAC Driver'。然后选中 'Device is Online' 复选框。

2) 转到 Ableton -> 首选项 -> MIDI。在 'Input: IAC Driver (Bus 1)' 的底部启用 'Track' 和 'Remote'。对于 'Output: IAC Driver (Bus 1)' 启用 'Track'.

3) 现在在您要从中发送音符的 Ableton midi 轨道中，Select 'IAC Driver' 作为 midi 输出。

4) 现在 'IAC Driver (Bus 1)' 应该通过 Web MIDI API.

显示为 Midi 输入

这里描述了这个过程：https://www.youtube.com/watch?v=MkWZ4rtRybQ

如何将 Web Midi API 连接到本机应用程序（如 Ableton live）

how to connect Web Midi API to native application (like Ableton live)

javascript

macos

midi

web-midi