Browserstack Win7 IE10 not playing HTML5 videos - testing

I've been building a website that uses HTML5 video. I started testing with Browserstack and everything looked good, until I got to Windows 7 IE10. Any video element simply wont load the .mp4 on Browserstack. It just shows a blank screen.
Examples of sites when testing:
http://html5demos.com/video
http://www.videojs.com/
Has anyone experienced this on Browserstack or is this a real Windows 7 IE10 issue?

I also have the same problem and contacted Browserstack.
They are aware about the problem and looking for a way to fix it (it is not as simple as somebody forgot to install something). Currently it works fine on Win 8 in IE10.
This is not a real issue on windows 7 in IE10.

BrowserStack has acknowledged this as an issue when testing IE 10 and 11 on Windows 7.
HTML5 videos work on all remote browsers, with the exception of Internet Explorer 10 and 11 on Windows 7.
Source: https://www.browserstack.com/question/649
HTML5 video does play fine on Windows 7 with IE 10 and 11. I can also confirm Sauce Labs doesn't have any issues playing video.

This Problem is not related to Browserstack Win7 IE10 , even on physical machine i am facing this problem . This is due to Content type add these.
If your hosting is served on a Linux/Apache web server, often you can add MIME types to an .htaccess file and upload it to your remote site's root folder.
Video:-
AddType video/mp4 .mp4 .m4v
AddType video/ogg .ogv
AddType video/webm .webm

Related

HTML5 video captions are not displayed on IE11 (Nginx server)

Is someone who stumbled upon and has a solution for this issue where HTML5 videos are not showing closed captions on IE11 browser only +OS Win8, Win10 (not reproducible on MS Edge 40, Chrome 66 or Firefox 60.0.1 browser)?
Later edit: Setup = Nginx server + IE11
Here is a demo link where you can find a HTML5 video with CC:
https://testdrive-archive.azurewebsites.net/Graphics/VideoCaptions/Default.html
Open this with IE 11 and turn on CC.
Found the answer to my specific problem - this is a IE11 issue: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/8832169/

HTML video looks different on different machines

I have mp4 video files. I want to show them on website with HTML <video> tag. But they look different on different machines.
I have an machine with XP Pro SP3, Chrome 49, it displays videos with shadows. And other machines don't appear to have this problem.
I've tried:
On problem machine:
Use native video player to play exact same video, no problem
Update video driver of problem machine to latest, problem still exists
Use Firefox, but Firefox complains not support this format of video
Disable some Chrome flags I think maybe relate to video (disable-accelerated-video-decode, disable-cast-streaming-hw-encoding), doesn't work. I even tried disable all experimental features of Chrome, problem still exists.
On virtual machines (virtual machines are not installed on problem machine, but on my other PC, because my problem PC only has 2GB memory):
On virtual machine with Win7, Chrome 44, no problem
On virtual machine XP Pro SP3, Chrome 44, no problem
Does anyone know why this happens, and how to fix it? Suggestions are also welcomed. I'm running out of ideas...
As far as I know currently, this is limited issue of Chrome 47-49 on XP.
I checked the Chrome change log, seems nothing related to video. No clue why this happens, and not sure how to fix it.

Safari 9 MP4 Video Issues

I am trying to figure out why an MP4 video is not working on our server only in Safari 9.
I have tried the video on my local device and it plays just fine on the website using the same version of Safari.
It appears to only not be working in Safari 9 on the server. I believe all the MIME types are setup on the server because the video works on other browsers.
The site is behind Cloudflare and I have tried using a file rule on .mp4 for Cloudflare to ignore and not serve that file.
Any ideas on what else I can try to get this fixed in Safari?
I'm trying to resolve a similar issue myself. I found the following SO piece that might help? Safari 9.0 can not play mp4 video on the storage server
In summary Safari doesn't make a full Range request in the header, unlike Chrome and other browsers. As a result it doesn't know how to interpret the response.
Further reading suggests that Apple requires HTTP servers to support byte range requests. https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/CreatingVideoforSafarioniPhone/CreatingVideoforSafarioniPhone.html#//apple_ref/doc/uid/TP40006514-SW6
It also looks like Apache <= 2.2.20 surfed a DoS exploit back in 2011 with Range Headers and were subsequently disabled by default. http://httpd.apache.org/security/CVE-2011-3192
I also think the issue is with Cloudflare. The mp4 from my tags are working on all browsers, except Safari. Once Cloudflare has been paused, the videos work on Safari too. Resuming Cloudflare recreates the issue.
If your server is Apache try placing this in .htaccess
SetEnvIfNoCase Request_URI .(?:gif|jpe?g|png|mp4|ogv|webm)$ no-gzip dont-vary
This solved videos not loading for me in Safari on a domain with Cloudflare enabled.
I think it's related to video or music content that needs to stream and based on CloudFlare must move to a subdomain like cdn.domain.com
Sites that do streaming content, however, should move their streaming
content to a subdomain we don't proxy in their DNS settings.
link
My Cloudflare isn't returning the Accept-Ranges header and so Safari won't play back my .mp4 files, regardless of size. Tried quite a few of the suggestions above without success. What finally worked was adding the missing header in via the .htaccess file.
<IfModule mod_headers.c>Header add Accept-Ranges "bytes"</IfModule>

Video not working in IE 10 without compatibility view enabled

i am trying to embed a video on a web page using video.js.
The video should play on mayor browsers. On Chrome and Firefox it is working fine, but i can not make it work in IE 10 on my local machine (Server 2008 R2). My html code is 100% of the supplied demo.html which is also not working on IE 10. I used absolute urls for video source and added mime types for video formats and additional files in IIS. When i use the compatibility view button, the movie works.
The following error code is displayed in the IE 10 console.
Video Error,[object Object]
The video is also working fine when i use another computer (windows 7, with IE 10, and without compatibility view) to surf to my dev machine, so i assume i have a local problem.
How can i debug this?

How to add mime-type for <video> element on Firefox?

Into this dir there are :
OGV video (Theora/Vorbis) for Firefox
MP4 video (H264/AAC) for Safari
FLV video with a flash player (player.swf) for others browsers
a template.html which contains a snippet coming from Video for everybody
a .htaccess to add the new types of video
Locally the video is correctly displayed on all browsers.
But online Firefox doesn't display the video and ask for a download. Though the mime-type is correctly set in my .htaccess.
Any idea to fix this problem on Firefox ? (I use 3.5.3 release on Windows).
Thank you. :)
Note: it sounds that this problem doesn't appear on Ubuntu.
Edit : my Firefox installation was bugged. Now it's working correctly. Thank you Rudism. :)
It may be worth trying it in Google Chrome which support video/ogg as well. May help you debug...