来自 base64 编码的 midi 的 MidiConvert答案

【问题标题】：MidiConvert from base64 encoded midi来自 base64 编码的 midi 的 MidiConvert
【发布时间】：2018-12-15 21:09:16
【问题描述】：

是否可以将出色的MidiConvert 与base64 编码的midi 数据一起使用？

我的数据如下所示：

data:audio/midi;base64,TVRoZAAAAAYAAQAOAeBNVHJrAAAALwD/Awl...

我想在浏览器中执行此操作。

【问题讨论】：

标签： javascript parsing base64 midi

【解决方案1】：

我能够使用以下方法使其工作，将 base64 编码的数据转换为Blob，以便可以使用FileReader 读取它，使其可以与MidiConvert.parse 一起使用：

(live example)

dataURItoBlob = dataURI => {
  const byteString = atob(dataURI.split(',')[1]);
  const mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];

  let ab = new ArrayBuffer(byteString.length);
  let ia = new Uint8Array(ab);
  for (let i = 0; i < byteString.length; i++) {
    ia[i] = byteString.charCodeAt(i);
  }

  return new Blob([ab], {type: mimeString});
};

parseMidiFromDataURI = dataURI => {
  const reader = new FileReader();
  reader.onload = e => {
    const partsData = MidiConvert.parse(e.target.result);
    console.log(JSON.stringify(partsData, undefined, 2));
  };
  reader.readAsArrayBuffer(dataURItoBlob(dataURI));
};

parseMidiFromDataURI("data:audio/midi;base64,TVRoZAAAAAYAAAABAeBNVHJrAAAA5wD/WAQEAhgIAP9RAwehIADAAADAAGWQXH8AwABlgFx/AMAAZZBZfwDAAGWAWX8AwABlkFZ/AMAAZYBWfwDAAGWQQ38AkEF/AJBCfwCQQH8AkD9/AMlPAJlPfwDAAACQU38AwABlgEN/AMAAZYBCfwDAAGWAP38AwABlgFN/AMAAZZBDfwDJTwCZT38AwAAAkFB/AMAAZYBBfwDAAGWJT38AwABliQB/AMAAZcAAZYBAfwDAAGWAUH8AwABlkE1/AMAAZYBDfwDAAGXAAGWATX8AwABlwABlwABlwABlwABlkDh/AP8vAA==");

输出：

{
  "header": {
    "PPQ": 480,
    "timeSignature": [
      4,
      4
    ],
    "bpm": 120,
    "name": ""
  },
  "startTime": 0.10520833333333333,
  "duration": 2.8406249999999984,
  ...

【讨论】：

嗨科迪，感谢您的帮助！当我运行您的代码时，我从 midiconvert 收到“str.substr 不是函数”错误。有什么想法吗？
@Hoff 嗯，不确定。你使用的是什么浏览器？这是一个代码笔，其中包含适用于我在 Chrome 70 上的完整最小示例：codepen.io/anon/pen/KbzJwb?editors=1012#0
非常感谢，您的代码运行良好！你拯救了我的一天！