Tonejs/Midi

Error: CreateListFromArrayLike called on non-object

Closed this issue · 1 comments

function submit() {
  const file = document.getElementById("upload").value;
  const midi = new Midi(file);
  midi.tracks.forEach((track) => {
    const notes = track.notes;
    notes.forEach((note) => {
      console.log(note.name);
    });
  });
}

I am reading the value from a file input element in the html
When I tried

async function submit() {
  const file = document.getElementById("upload").value;
  console.log(file);
  const midi = await Midi.fromUrl(file);
  midi.tracks.forEach((track) => {
    const notes = track.notes;
    notes.forEach((note) => {
      console.log(note.name);
    });
  });
}

I got the following errors:
Fetch API cannot load c:\path\file.MID. URL scheme must be "http" or "https" for CORS request.
midi:1 Uncaught (in promise) TypeError: Failed to fetch

This error seems to be caused because you are trying to load a local file. fromUrl requires a server to be serving the files. And the constructor in the first example takes a Buffer.

I would suggest taking a look at the FileReader API. It might be what you're looking for in order to load local files without a server.