How to get mp3 files to play in iPhone Safari web browser?

Question

How can I get an MP3 audio file to play in iPhone Safari (OS 3.1)?

Currently, I am generating HTML e.g.

<a href="file.mp3"><img src="sound.png" alt="Play audio"/></a>

to play the file on clicking on the nested image. This works on Safari on OSX, but not on the iPhone. There, the content of the file is shown as text, but it does not appear to be a mime-type problem when checked with Live HTTP Headers from Firefox.

I have found approaches referenced here. These require the Safari Plugins setting to be on in the preferences, which is why it did not previously work for me.

Solution 1

I imagine your best bet is to invoke a quicktime object in your web page. For playing mp3 files, your best bet is to serve a Winamp .pls style playlist with mimetype audio/x-scpls that serves as a signpost to the mp3 files. Create an embedded quicktime object around it. Try the docs for quicktime:

http://www.apple.com/quicktime/tutorials/embed.html

Solution 2

If you manage to get it working, it will play in the QuickTime Application (Full screen).

The HTML5 sound API is not available in the current iPhone OS (3.XX), but in OS 4.XX it will be available (at least playing video without launching the full screen player)

Solution 3

Use the HTML5 audio tag with an mp3 in it. http://www.w3schools.com/tags/tag_audio.asp

Comments

[jottos]

sadly no html 5 on iphone 3.x

[jottos]

sorry, my code example defeated the layout box. Note - on 4.x iPhone and 3.x iPad this html5 tag works correctly, as I pointed out, on 3.x iPhone it will take you to a quicktime window

[webb]

This answer is a broken link and no code. Would someone with more rep please downvote it.