.MOV uploads work from iPad but don't from chrome - html

I am trying to upload .mov files that have been recorded using an iPad but I want to upload them using Chrome on the PC.
The video uploads just fine however on playback all I get is a white screen ( Audio + Play controls also load up fine ).
Alternatively when the video file is uploaded using an iPad and loaded on the PC (chrome again) , the video plays back as intended.
Im using a HTML5 video tag.
<video width="320" height="240" controls>
<source src="files/nameremoved.mov" type="video/mp4">
Your browser does not support the video tag.
</video>
My assumption is that iPad uploads compress the video into something that chrome can playback.
To fix this do I need to convert the .mov uploads that are uploaded using a PC to a chrome friendly format?

You are right, what you would want to do is to upload them as mp4.
There's not supposed native .MOV support on chrome but you can try to add some extension.
Besides you are requesting chrome to play a type="video/mp4" and you are giving it a .mov
<source src="files/nameremoved.mp4" type="video/mp4">

Related

Safari won't play HTML5 video

I'm trying to create a HTML5 video background for a website but I cannot seem to get it to work on Safari. Does anyone have any ideas?
Here's the HTML video tags I'm using
<video id="bgVideo" class="bg__video" autoplay loop>
<source src="./vid/Sample_Vid.ogv" type="video/ogv">
<source src="./vid/Sample_Vid.m4v" type="video/m4v">
<source src="./vid/Sample_Vid.webm" type="video/webm">
</video>
I've tried adding a script tag under it to start playing the video with JS but that's not helped either.
document.getElementById("bgVideo").play();
When I inspect the page it looks like the video element is taking up space in the DOM but it's just invisible basically.
I've also tried opening the .m4v files directly in the browser & it plays it there so I assume the file isn't an issue. These were all generated from easyhtml5video.com
I also have the Modernizer script to detect if autoplay is enabled for the browser which I've had to alter based on a pull request in the github repo as it was always saying that Safari doesn't support autoplay otherwise.
The test site I've setup is http://treetopia.neilnand.co.uk/
The supported video format for Safari is mp4 with H.264 encoding. (you have a .m4v extension and file type)
If video does not has sound - use
document.getElementById("bgVideo").volume = 0;
Safari don't allow autoplay for videos with sound.

HTML5 video won't display

I am trying to display a video on a webpage.
I tested it locally and it works fine. However, when I put it in my webpage's repository (on a different computer) and access it through the internet, the video does not appear.
I included an mp4 and an ogg as source files, and tested it on both Firefox and Chrome, but neither work. I am sure the video path is correct.
Any thoughts?
<video width="205", controls>
<source src="movies/video1.mp4" type="video/mp4">
<source src="movies/video1.ogv" type="video/ogg">
Your browser does not support HTML5 video.
</video>
Solved!
Videos did not have read access.

html5 video not playing within Safari on Windows

I'm trying to play a HTML5 video in safari on my local server but currently it isn't working properly. Here's the issue:
I have the code:
<video width="580" height="340" controls>
<source src="media/video/test.mp4" type="video/mp4">
<source src="media/video/test.m4v" type="video/mp4">
<source src="media/video/test.ogv" type="video/ogv">
<source src="media/video/test.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
It simply says 'Your browser does not support the video tag.' when I view it on my local server through Safari. I made sure to add the mp4 etc MIME types in IIS and restarted including the WWW service.
The video plays fine when I view it via direct path in Safari and it works playing it within Chrome from the HTML.
Any ideas? Cheers!
Update
I didn't have Quicktime installed on my machine. Once installed, the HTML5 video played.
The version of safari you are using probably doesnt support the new html5 video tag,
you could try using a different type of player (shockwave youtube etc) to extend your browser support
I didn't have Quicktime installed on my machine. Once installed, the HTML5 video played.

Problems embedding mp4 video

I'm trying to use the html5 video tag to embed an mp4 but I'm having some issues that vary across different browsers.
My code looks like this:
<video controls="controls" width="640" height="360">
<source src="http://www.mydomain.com/video.mp4" type="video/mp4" />
</video>
IE - Won't recognize the file when trying to embed (edit: IE was actually dragging on the file size not the format) and when the uri to my video is plugged into the address bar it opens the video in windows media player.
Chrome, Firefox - Simply will not recognized the file format (edit: Firefox was dragging on the size as well, Chrome was the only browser having issues) and when the uri is plugged into the address bar it attempts to play the video within the browser but fails.
Could there be something within the file that would prevent it from being embedded? If so, how can I find this out?
The problem is likely that the browsers are not supporting MP4, because it is a proprietary format. To get the best cross-browser support you'll have to also encode your video in WebM and Ogg/Vorbis formats and then add those files to your video tag with their own source tags.
Just because a browser will play a video if you navigate directly to the video's URL does not mean that the browser supports that format. Usually, navigating straight to the video causes the browser to play the video with a plug-in such as Quicktime or VLC that has much better codec support than the browser does.
try this without that "/"
<video controls="controls" width="640" height="360">
<source src="http://www.mydomain.com/video.mp4" type="video/mp4" >
<source src="http://www.mydomain.com/video.ogg" type="video/ogg" >
</video>

Can you embed VLC on a website so that people who doesn't have VLC installed can view it?

I am trying to make a video streaming site and I want to use VLC to play my video. However, I want other people who doesn't have VLC to be able to view my videos through a VLC plugin. Is it possible? I want to use VLC because it can play anything.
The viewer has to have VLC and the Browser Plugin Installed on there pc, depending on the file format of the video you could use the HTML5 Video tag.
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
Update your browser.
</video>
This will only work if the viewer has a html5 ready browser meaning old versions of IE wont be able to see the video but the code will tell them that they have to update there browser
You might want to checkout the current beta of http://www.projekktor.com - it's a generic HTML 5 player, which uses whatever backend is available on the user's PC. Since recently, it also supports VLC: https://twitter.com/projekktor/status/354187957571297281