About embed midi files on a webpage

Question

I am working on a project related to vintage web designs. I would like to embed and autoplay a midi file but:

1. It doesen't work on IOS (I tried with my ipad)
2. On Firefox, sometimes the tune is not played, I don't know why.

Does the midi player depends on the browser or a plugin? Can I find a univeral alternative to play my tune?

I am using the <embed> tag this way:

<embed src="tune.mid" hidden="true" autostart="true" autoplay="true">

Answer 1

I've referenced this question before and fell upon the answer of using the library midijs. However, since that lib now has a bitcoin miner included, I've made a variant without the mining code:

https://kitchwww.github.io/midi/midi.js

It can be included and used in exactly the same way:

<script type='text/javascript' src='https://kitchwww.github.io/midi/midi.js'></script>
<a href="#" onClick="function(){
MIDIjs.initAll();
MIDIjs.play('path/to/yoursong.midi');}">Play My Song</a>

EDIT: updated to include an init function to be called on a User Gesture, as all audio must now be initiated from one.