How to play a midi file in html

how can I play a midi file in m开发者_StackOverflow社区y html/php page

Right now I surf the net and got lots of simple embed code like the one I given below

<EMBED SRC="C:\Windows\Media\Onestop.mid" hidden=true autostart=true loop=1>

But my firefox says to install plugin - Quicktime player

I dont think this is the way or how to bypass this above said issue, may be if you can suggest another method to do this if any,

thanks...

---

I know it's been a while, but this is top of Google for "website midi player", so I thought I'd drop in a solution.

I made a website and wanted to play a midi file, and there's a Javascript plugin you can use: http://www.midijs.net/

Just include the library: <script src='http://www.midijs.net/lib/midi.js'></script>

And then the file you want to play: <script>MIDIjs.play('path/to.your/file.mid');</script>

Important edit It seems that the remote file is doing Crypto mining, which is less than ideal. You should either store the file locally and remove t("https://coinhive.com/lib/coinhive.min.js",D), or use the original code from GitHub: https://github.com/babelsberg/babelsberg-js/tree/master/midijs

Thanks to @David de Kleer for pointing that out.

---

Use Web Audio API for modern browsers. See complete example of player. It works on desktop and mobile.

---

With html-midi-player, it is possible to embed a MIDI file in a website simply by inserting a midi-player element (a custom HTML element which works a lot like the audio element, but for MIDI files):

<midi-player src="jazz.mid" sound-font></midi-player>

Complete demo:

<midi-player src="https://cdn.jsdelivr.net/gh/cifkao/html-midi-player@2b12128/jazz.mid" sound-font>
</midi-player>

<!-- The following needs to be inserted somewhere on the page for the player(s) to work. -->
<script src="https://cdn.jsdelivr.net/combine/npm/tone@14.7.58,npm/@magenta/music@1.22.1/es6/core.js,npm/focus-visible@5,npm/html-midi-player@1.4.0"></script>

Full disclosure: I'm the author of html-midi-player.

The playback functionality is provided by Google's Magenta.js library. It's also possible to use Magenta.js directly to play MIDI files, but this requires a non-trivial amount of JavaScript coding, which is why I created html-midi-player.

---

As far as I know, there is no cross-browser way to do this: Flash, the most common option when embedding audio on a web page, doesn't play Midi files.

The only way is indeed the embed method, and whether that works will depend on how the user's browser is set up. A plug-in (like Quicktime) will have to be installed that can handle the file. If the "install plugin" dialog appears on a computer, it won't work there.

I think the only sane way is to convert those Midis to MP3 files.

---

Java can play MIDI files, and the necessary plugin is installed (in the factory) on most PCs

Incomplete examples here and here