Recently I encountered a strange problem when playing an m4a audio file in Safari.

If I directly open the m4a URL in Safari, it plays well, but if I add the m4a file to an HTML5 audio tag <audio>, it just keeps on loading and can never be played.

The m4a file plays well in Chrome and Firefox HTML5 player, just not in Safari.

After some testing and investigation, I realised that when directly open the m4a URL in Safari, it probably uses the codec of MacOS, but when adding the file to an HTML5 audio tag <audio>, it will only use the codec available to Safari. And there is a difference.

To fix the problem, we need to re-encode the m4a file and make it compatible with Safari HTML5 player.

The following steps will show you how to convert an m4a file to Safari HTML5 compatible with iTunes:

Step 1 – Launch iTunes, goto top menu iTunes -> Preferences, General tab, click the button Import Settings, change the option Import Using to AAC Encoder, change the Settings to High Quality (128 kbps).

Click to enlarge

Step 2 – In iTunes, select Music, find your song in the Music Playlists. If your m4a audio is not listed there, right click on the m4a file, select Open With -> iTunes and play it with iTunes.

Click to enlarge

Step 3 – Select the song, then goto iTunes top menu File -> Convert -> Create AAC Version.

Click to enlarge

Step 4 – After the conversion is done, drag the newly created file and drop it on desktop.

Click to enlarge