homepage Welcome to WebmasterWorld Guest from 54.197.147.90
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

    
HTML5 video in IE
Having some trouble playing html5 video in internet explorer
brandozz




msg:4602125
 2:54 pm on Aug 15, 2013 (gmt 0)

I'm having some issues trying to use html5 to play back a video. Everything is fine in Firefox and Chrome but Internet Explorer will not play the video.

Here is my code


<video class="video" controls="controls" poster="img/video.jpg" width="548" height="308">
<source src="video.mp4" type="video/mp4" />
<source src="video.webm" type="video/webm" />
<source src="video.ogv" type="video/ogg" />
<object id="flowplayer" type="application/x-shockwave-flash" data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" width="548" height="308">
<param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" />
<param name="allowFullScreen" value="true" />
<param name="wmode" value="transparent" />
<param name="flashVars" value="config={'playlist':['img%2Fgetlowfees-video.jpg',{'url':'video.mp4','autoPlay':true}]}" />
<img src="img/video.jpg" width="548" height="308" title="No video playback capabilities, please download the video below" />
</object>
</video>


We have the mp4 MIME type set up on the IIS. I should also say that this is an asp.net application. Only time there is an issue is trying to playback in IE on a IIS or my local windows machine.

thanks

 

DrDoc




msg:4602140
 3:52 pm on Aug 15, 2013 (gmt 0)

Which IE version? Or is it in all of them?

brandozz




msg:4602142
 3:56 pm on Aug 15, 2013 (gmt 0)

It is all of them, I've tested IE7 - IE10

drhowarddrfine




msg:4602184
 6:33 pm on Aug 15, 2013 (gmt 0)

It took us forever to get IE to play using the audio tag. I'd bet you find out the problem lies in how it's encoded. Anything can play your video but IE but once you figure out the magic pixie dust, everything will play just fine. The problem is, finding out where the magic pixie dust is.

Writing code for IE is like adjusting a rabbit ear antenna for a TV.

brandozz




msg:4602185
 6:36 pm on Aug 15, 2013 (gmt 0)

I'm actually having the individual that produced the video look into that. I'll post what I find.

Strangely when the video is uploaded to a Linux server the video plays fine in IE.

Fotiman




msg:4602199
 7:59 pm on Aug 15, 2013 (gmt 0)


Strangely when the video is uploaded to a Linux server the video plays fine in IE.

In that case, I'd suggest running something like Fiddler to inspect the HTTP headers and compare the differences between the headers from the Linux server and those from IIS.

brandozz




msg:4602245
 10:14 pm on Aug 15, 2013 (gmt 0)

Will Fiddler work locally? Can I install it on my windows pc where I am developing the application?

brandozz




msg:4602254
 10:41 pm on Aug 15, 2013 (gmt 0)

I've installed fiddler, and I'm looking at the video and I'm wondering if there is anything specific I should be looking for. Nothing is really jumping out at me as being an error.

Fotiman




msg:4602273
 12:50 am on Aug 16, 2013 (gmt 0)

I would find the HTTP request for the actual video file that should be playing, and then do an exact comparison of what was sent in the Linux-served header vs. the IIS one, and identify what EXACTLY is different. If it's the same file and it's playing on one but not another, then I suspect the Linux one is sending something that the IIS one isn't (but should be), or that the IIS one is sending something that the Linux one isn't (and shouldn't be).

brandozz




msg:4602286
 2:56 am on Aug 16, 2013 (gmt 0)

I was actually able to get this to work in IE by using absolute urls instead of relative urls.

I wonder if my asp.net application was having some type of effect on the relative urls. Although the videos are embedded in the Default.aspx page content area, not in a master page or include file.

brandozz




msg:4604572
 1:29 am on Aug 24, 2013 (gmt 0)

So I wanted to update this. I was able to get my video to work in IE but now it's not working on iphone or ipad. I didn't expect this, I've been reading that the iphone and ipad support mp4 video with H.264 codec.

I opened my mp4 file in quicktime and exported it for iphone and ipad as a .m4v file which doesn't work with IE.

I've gotten desperate and actually used the "visible-desktop" (bootstrap) class on the mp4 that works with IE and all other desktop browsers and "visible-phone visible-tablet" on the m4v that works on mobile and tablet devices. I really don't want to do this because the browser is actually loading two video files even though one is not visible.

drhowarddrfine




msg:4604668
 1:27 pm on Aug 24, 2013 (gmt 0)

You've got to be careful making adjustments to make things work on IE while breaking modern browsers to do it.

Like I said before, wish I could be more helpful but I just don't recall how we got things working.

brandozz




msg:4604966
 3:00 pm on Aug 26, 2013 (gmt 0)

I've been doing a lot of testing. I uploaded the video to a Linux server and created a simple html page and embeded the video in it, defined the video types in my htaccess and the iphone and ipad will play it. The video that the ipad and iphone will not play is on a Windows server.

Fotiman




msg:4604974
 4:06 pm on Aug 26, 2013 (gmt 0)

Again, going back to what I said earlier...

I would find the HTTP request for the actual video file that should be playing, and then do an exact comparison of what was sent in the Linux-served header vs. the IIS one, and identify what EXACTLY is different. If it's the same file and it's playing on one but not another, then I suspect the Linux one is sending something that the IIS one isn't (but should be), or that the IIS one is sending something that the Linux one isn't (and shouldn't be).

brandozz




msg:4604975
 4:24 pm on Aug 26, 2013 (gmt 0)

I've tried to examine the network traffic using fiddler but I just don't see anything different.

Fotiman




msg:4604989
 6:27 pm on Aug 26, 2013 (gmt 0)

Can you post the Response Headers for the files? In Fiddler, select the HTTP request for the file (result should be 200), then under Inspectors, select the "Headers", then click the [Raw] link to get a version that you can just select and copy. Do the same thing for both servers.

brandozz




msg:4605016
 9:10 pm on Aug 26, 2013 (gmt 0)

This is from the Windows Server:
HTTP/1.1 200 OK
Date: Mon, 26 Aug 2013 21:03:21 GMT
Content-Type: video/mp4
Transfer-Encoding: chunked
Connection: keep-alive
Keep-Alive: timeout=5
Last-Modified: Mon, 19 Aug 2013 20:48:42 GMT
ETag: "a4e94b7d1d9dce1:0"
Server:


This is from the Linux Server:
HTTP/1.1 304 Not Modified
Server: nginx
Date: Mon, 26 Aug 2013 21:10:18 GMT
Last-Modified: Mon, 26 Aug 2013 20:38:01 GMT
Connection: keep-alive
ETag: "521bbca9-339c86"
X-Powered-By: PleskLin

Fotiman




msg:4605033
 10:53 pm on Aug 26, 2013 (gmt 0)

The Linux version is returning 304, so you'll need to empty your browser cache to get the 200 OK message on the Linux server.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved