audio タグを使用して html5 で音楽を再生する必要があります。データは、サーバーによって生成される base64 文字列 (data:audio/wav;base64,xxxxxx) です。imageタグと同様に、audioタグもdata urlを使えるとのことなので、こんな感じでやってみました。
<audio controls="controls" autobuffer="autobuffer" autoplay="autoplay"
src="data:audio/midi;base64,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"/>
しかし、私は失敗しました、何も起こりませんでした。私は結果を検索し、これを見つけました：
html5 で base64 データを使用してオーディオを再生する
回答にデータのURLがあり、試してみましたが、うまくいきました。
私のbase64データは間違っていると思いますが、データのURLをブラウザのアドレスバーに入れると.プラグインで再生されます!!以下のように同じパフォーマンスです(うまくいきましたが、プラグインを使用する必要があります):
<object width="50%" height="50%"type="audio/midi" data="data:audio/midi;base64,TVRoZAAAAAYAAAABAHhNVHJrAAAOigD/Awh1bnRpdGxlZAD/AQRnZ2cKAP9YBAMCGAgA/1kCAAAA/1EDBhqAAP8GBVNldHVwAMBPALAHbgAKQADBTgCxB0QACjoAwgQAsgdVAAp8AJI0VADHBAC3Bz0ACgMAB2AACgwAyCMAuAdSAApABpc0VDaSO1AGlztQNpJAUgaXQFI2kkJaBpdCWjaSQ1YGl0NWMZJCAAVHSgGXQgAFR0IdkjsABUAAAZc7AASSNAABl0AABJJDAAGXNAAFQwAEkjBSBpcwUjaSN04GlzdONpJAVgaXQFY2kkJcBpdCXDaSQ1wGl0NcJ5JHAAVCAAGXRwAFQgAEkkdGBpdHQhOSQAAFNwABl0AABTcACZJDAAAwAAaXQwAAMAAJkjJUBpcyVDaSOUoGlzlKNpI+VgaXPlY2kkBWBpdAVjaSQlYGl0JWJ5JHAAaXRwAJkkAAAEVIBpdAAABFQhiSPgAGlz4ABJI5AABCAAUyAAGXOQAAQgAFMgAJki9UBpcvVDaSOVAGlzlQNpI+VAaXPlQ2kkBUBpdAVDaSQlQGl0JUJ5JFAAaXRQAJkkVGBpdFQAmSPgAGlz4ACZJCAAA5AAVAAAGXQgAAOQAFQAAEki8ABpcvAASSRQAFLVQAQEoAN04Bl0UAAJI8VAWXLVQAQEoAN04BPFQ1kjREBpc0RCeSNwAGlzcACZI3SgaXN0ookjwABpc8AAiSPFQGlzxULZJAAAaXQAADkkJUBpdCVDaSQgAAQ1gGl0IAAENYCZI3AAaXNwATkjQABS0AADwAAZc0AAUtAAA8AAiSL1YBQwABO0YCOUIAPk4Cly9WAUMAAJJFVgGXO0YCOUIAPk4DRVYwkjZKBpc2SimSOQAGlzkAB5I5SAaXOUgwkj4ABpc+AACSPlIGlz5SLZJFAAaXRQADkkJQBpdCUDaSOQAGlzkAE5I2AAaXNgAHkjsABi8AAJc7AAGSPgAAQgAFly8AAT4AAEIACZIoRgE0RAE7QABATgSXKEYBNEQBO0AAQE40ki1GBpctRjaSL0gGly9INpI5RAaXOUQakjsABpc7ABaSO0wGlztMJ5I5AAaXOQAJkjlKBpc5SjCSQAAEOQABNAABl0AAAJI3RgE0NgOXOQABNAABN0YBNDaBWpItAAaXLQAJkEdaG5IvAAaXLwAbkUdaCpI3AAaXNwAFkjQABpc0AAuSOwACKAAElzsAAZBHAAGXKAAOkExaAJI0VAaXNFQnkUcAD0xaAJI7UAaXO1A2kkBSBpdAUjaSQloGl0JaIpBMABRTXgCSQ1YGl0NWIpFMAA+SQgAFkVNeAJJHTAGXQgAFR0IdkjsABZBTAACSQAABlzsABJI0AAGXQAAEkkMAAZc0AAVDAASQU1oAkjBSBpcwUiKRUwAUU1oAkjdOBpc3TjaSQFYGl0BWNpJCXAaXQlwdkFMAGVFWAJJDXAaXQ1wdkVMACpJHAAVCAACQUQABl0cABUIABJBPVgCRUVYAkkdIBpdHSBOSQAAFNwABl0AABTcACZJDAAAwAAWQTwAAkVEAAZcwAABDAAmQTlYAkU9WAJIyVAaXMlQskU8ACk5WAJI5SgaXOUo2kj5WBpc+VjaSQFYGl0BWIpBOABRPVgCSQlYGl0JWIpFOAAWSRwAGl0cACZJAAACRT1YAkkVKBpdAAABFQhiSPgAFkE8AAZc+AASSQgAAOQAFMgABl0IAADkABTIACZBRVwCSL1QGly9UHZFPABlRVwCSOVAGlzlQNpI+VAaXPlQYkFEAHpJAVAaXQFQYkVEAHpBPVgCSQlQGl0JUJ5JFAAWQTwABl0UACZBOVgCRT1YAkkVIBpdFSAmSPgAGlz4ACZJCAAA5AAVAAAGXOQAAQgAFQAAEki8ABZBOAACRTwABly8ABJJFAAWQTFYAkU5WAJItVABASgA3TgGXRQAAkjxUBZctVABASgA3TgE8VCuRTgAKTFYAkjREBpc0RCeSNwAGlzcACZI3SgaXN0ookjwABpc8AAiSPFQGlzxUGJBMABWSQAAGl0AAA5BOVgCSQlQGl0JUGJFMAA+SNAAFkE4AAZc0AAmSQgAAkE9WAJFOVgCSQ1gGl0IAAENYCZI3AAaXNwAYkjwAAC0ABZFOAACQTwABly0AADwACJIvVgFDAACQTlYAkU9WA5I5QgA+TgKXL1YBQwAAkkJWA5c5QgA+TgNCViaRTwAKTlYAkjI8BpcyPDaSNkgGlzZIKZI5AAaXOQAHkjlSBpc5UiKQTgAOkj4ABpc+AACQSlYAkj5QBpc+UCKRTgAFkjIABpcyAACSQgAGl0IAA5I2AACRSlYGlzYAJpIvAAE5AAA+AACQSgAFly8AAT4AADkACZBHUgCSKFQBNE4BO04ElyhUATROATtOJZFKAA9HUgCSLUoGly1KNpIvUgaXL1IpkjsABpc7AAeSOVIGlzlSNpI7UgaXO1InkjkABpc5AAmSOVIGlzlSJpI7AAaXOwACki8ABpcvAAGSNAABMkUFlzQAATJFNJI5AAI0UASXOQACNFA2kEcAAJI3UAaXN1A2kUcAAJI7UAaXO1A2kEdaAJJAUAaXQFA2kjcAAC0AAJFHWgaXNwAALQAYkjQAACgABpc0AAAoAAmSOwAAMgAAQAAAkEcABpcyAAA7AABAAAmQTFoAkjBUBpcwVCeRRwAPTFoAkjdSBpc3UjaSPFIGlzxSNpI+WgaXPloikEwAFFNiAJJAVgaXQFYikUwAFFNiAJJDVgaXQ1YmkFMAEFNcAJJHUgaXR1IYkVMAHlNaeJJAAAaXQAAWkFMAIJI+AACQUVYGlz4AAZFTACWQUQAQkjwAAJBPVgCRUVYGlzwACZI3AAaXNwAJkkMABpdDAAiQTwAAkVEAAZJHAAAwAAaXMAAARwAJkE5WAJFPVgCSMlQGlzJUJpFPABBOVgCSOVIGlzlSNpI+UgaXPlI2kkBYBpdAWBKQTgAkT1oAkkJSBpdCUhWRTgAhT1oAkkVSBpdFUh2QTwAZUVcAkkpSBpdKUh2RTwAZUVdpkkAAAJBRAAaXQAA2kVEAD5JCAACQSloGl0IAIpI+AAaXPgAOkUpaBZI5AAaXOQAEkkUABpdFABOSMgAAkEoABZJKAAGXMgAFSgAJkExaAJItVABASgA3TgE8VAWXLVQAQEoAN04BPFQhkUoAFExaAJI0SAaXNEgnkjcABpc3AAmSN1AGlzdQKJI8AAaXPAAIkjxYBpc8WCeQTAAGkkAABpdAAAOQTloAkkJUBpdCVBiSNAAGlzQACZFMAAWQTgAKkkIAAJBPWgCRTloAkkNYBpdCAABDWAmSNwAGlzcAGJItAAA8AAWQTwAAkU4AAZctAAA8AAiSL1YBQwAAkFFaAJFPWgGSOVQCNkIAPlICly9WAUMAAJJFVgGXOVQCNkIAPlIDRVYmkU8AApI2AAaXNgACkVFaAJI2TgaXNk4vkjkABpc5AAGSOVIGlzlSMJI+AAaXPgAAkj5aBpc+Wh+QUQAOkkUABpdFAAOQTlYAkkJUBTYAAZdCVAU2ABqRUQAXkjkAAJFOVgaXOQAmki8AAUIAAJBOAACSPgAFly8AAUIAAD4ACZBMVgCSKEwBNEQBO0AAQE4ElyhMATREATtAAEBOJZFOAA9MVgCSLUoGly1KNpIvUAaXL1ApkjsABpc7AAeSOUwGlzlMNpI7TgaXO04nkjkABpc5AAmSOVAGlzlQMJJAAAQ5AAE0AAGXQAAAkjdKATQ2A5c5AAE0AAE3SgE0NoFakEwAD5ItAAaXLQALki8ABpcvABaRTAABkjQABpc0AAiSNwAGlzcAIJI7AAIoAASXOwACKAAOkFNaAJgffwC4B0oBkitGAT5WADJEATtKADdIBJcrRgE+VgAyRAE7SgA3SDORU1qBFpBTAB5WWh6RUwAeVloZkFYAI1VaGZFWACNVWlqQVQAeU1oekVUACpBTABRRWgCRU1ooUwAUUVoDkjsABpc7AAiSMgAGPgAAlzIABj4AApIrAAI3AAKQUQAClysAAjcAFZBTWgKSK0YBPlYAMkQBO0oAN0gElytGAT5WADJEATtKADdIGZFRABKSMgAGlzIAAZFTWgCSMkYGlzJGMJI3AAaXNwAAkjdABpc3QDGSNwAFOToBlzcABTk6MJI7AAaXOwAAkjtABpc7QCaSPgAGlz4ACpI+SAaXPkg2kkM+BpdDPoElkFMAP5FTAAaQT1otTwAPUVoAkU9aEJc5AAGSOwAGlzsABJI+AAEyAAQ5AAErAACXPgABMgACkkMAA5crAANDAAOQUQAAkU8AD5gfAACQU1oAkVFaAJgffwOSK0YBPlYAMkQBO0oAN0gElytGAT5WADJEATtKADdIIpFRAAmSMgAGlzIAAJFTWgCSMjoGlzI6MZI3AAU3OAGXNwAFNzg2kjk4Bpc5OBiQUwAZkjsABZBWWgCSOz4BlzsABTs+GJFTAA+SPgAGlz4ACZFWWgCSPj4Glz4+CZI3AAaXNwAJkFYAGZI+AAWYHwAAkFhWAJJASACYIX8Blz4ABUBIGJI5AACRVgAGlzkAE5IyAAWRWFYAkjE4AZcyAAUxOCKSOwAGlzsADpI0OgaXNDoskkAABpdAAASSOTwGlzk8GJBYAB5VVgCSPTYGlz02E5I0AAWRWAABlzQAHZFVVgCSQDwGl0A8E5IxAAA9AAWQVQABlz0AADEACZI5AAaXOQAHkisAAkAABJcrAAGYIQAAkFNaAJgjfwGXQAACki9GAUJWADZEAT9KADtIBJcvRgFCVgA2RAE/SgA7SBORVQAYkjYABpc2AACRU1oAkjZIBpc2SDGSOwAFOzwBlzsABTs8MZI7AAU9PAGXOwAFPTwxkj8ABT9AAZc/AAU/QCeSQgAGl0IACZJCRAaXQkSBNpBTAFqRUwAlkj0ABpc9ACKSNgAAPwAGlz8AADYABJJCAAaXQgAMki8ABpcvAB+YIwAA/y8A"></object>
だから私の質問は: 2 つの方法の違いは何ですか?
オーディオタグを使用する場合に含まれているはずのファイルヘッダーがいくつかあると思いますが、それについてはわかりません。
男がヘッダーテンプレートを使用するこのリンクを見つけます(RIFF<##>WAVEfmt \x10\x00\x00\x00\x01\x00\x01\x00<##><##>\x02\x00\x10\x00data <##>"):
data:url google chrome mobile からオーディオを再生する
事前に感謝します。
EDIT ああ、ほとんどのブラウザがオーディオ/ミディデータ型をサポートしていないことを知って申し訳ありません.プラグインがより強力であるため、オブジェクトタグで再生できます. そして、ここで midi.js を見つけました。