Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

IE bug Invalid Source HTML5 audio - workaround

I (and about a million others) have found a bug in IE11 (not sure if other versions have the same bug) where, if you create an HTML5 audio tag, the browser reports "Invalid Source" no matter what. I've tried every combination I can think of with no luck. So far: Changing the HTML end tags from self-closing to explicit Changing the file name to eliminate any odd characters Changing the audio sub format to every possible setting Adding an explicit URI ("http:// ...") Disabling all plugins (there were on the stock plugins) Trying every possible audio format Defining the MIME type Changing the audio tag's parameters. Changed the IIS settings to include the MIME types.

Checking Microsoft's "Connect" website - (they make the claim that it is not reproducible, but hundreds of thousands of Google results suggest otherwise).

Is this no possible at all? ALL other latest & greatest browsers I tried work (FireFox, Opera, Safari, Chrome) I'm at wit's end - no solutions work.

Here's the code:

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="AudioPopupPlayer.aspx.vb" Inherits="AudioPopupPlayer" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
        <div style="padding-top: 30px; margin: auto; width: 300px;">
        <asp:Literal ID="litVoiceOver" runat="server"></asp:Literal></div>
</body>
</html>

Code behind:

Partial Class AudioPopupPlayer
Inherits System.Web.UI.Page

Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
    Dim VoiceOverFileName As String = Request.QueryString("vo")
    If VoiceOverFileName.Length > 0 Then
        Dim root As String = HttpContext.Current.Request.Url.GetLeftPart(UriPartial.Authority) + ResolveUrl("~/")
        Dim audiosource As String = "<audio id=""VoiceOver"" autoplay=""autoplay"" preload=""preload"" controls=""controls""><source src=""" & root & "audio/" & VoiceOverFileName & ".ogg"" type=""audio/ogg"" ></source><source src=""" & root & "audio/" & VoiceOverFileName & ".mp3"" type=""audio/mpeg"" ></source><source src=""" & root & "audio/" & VoiceOverFileName & ".wav"" type=""audio/wav"" ></source></audio>"
        Me.litVoiceOver.Text = audiosource
    End If
End Sub

 End Class

And, finally, a screenshot (in IE11) showing that the HTML is rendered perfectly, yet I still get the dreaded "Invalid Source" message (NOTE: copying and pasting the link causes the audio file to play - go figure).

bug in IE 11

like image 933
MC9000 Avatar asked Jun 13 '14 20:06

MC9000


1 Answers

I had the same issue trying to use the simple HTML5 code. The url and file name were correct as well. This is what worked for me:

<audio src="song.mp3" controls autoplay></audio>

You can remove the controls if you don't need them, it's still going to work. I hope this helps!

like image 101
guest123 Avatar answered Oct 14 '22 22:10

guest123