I am trying to get a movie uploaded from a mobile device to play in a browser.
It works fine in Chrome and FF and IE9(compatibility mode) but I cannot get it to play in IE9 not in compatibility mode.
My embed code is:
<video id='vid' class='video' width='274' height='169' controls='controls' preload='load' autoplay='autoplay'>
<source src='/videos/vid1.mov' />
<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="320" height="256" >
<param name="src" value='/videos/vid1.mov'>
<param name="autoplay" value="true">
<param name="loop" value="false">
<param name="controller" value="true">
<embed src='/videos/vid1.mov' width="274" height="169" autoplay="true" loop="false" controller="true" pluginspage="http://www.apple.com/quicktime/"></embed>
</object>
</video>
At first I was just trying the Html5 embed code, but that didn't work, so switched it out for object and embed which didn't work either.
I found that I can combine both here: http://www.w3schools.com/html/html_videos.asp
but still it doesn't work anyway.
After spending 2 hours googling and trying different variations of this I need help!
IE9's HTML5 specs only support H.264 video encoding, so it's worth checking if the .mov was encoded properly
http://blogs.msdn.com/b/ie/archive/2010/04/29/html5-video.aspx
It could also help to supply at least 2 formats of your video, as not all browsers support one particular format. Perhaps .mp4 and .mov? If you're really ambitious swap .mov with .ogv, add a flash-based fallback as your object tag and you should be pretty well set.
change the mime type (as the server delivers it to the browser) from video/quicktime to video/mp4. Simplest way to do this, would be to add this to your .htaccess file:
AddType video/mp4 .mov
Everything should be good once you have this in place. The only other thing you'll likely see is videos coming from an iPhone being rotated 90 degrees to the left. This is the raw format stored by iOS. You'll have to take care of that on the iPhone or the server
Related
I have a video archive that I have working in everything except IE 11. I get the error "Error: Unsupported video type or invalid file path" when loaded in IE 11. Below is the HTML I am using.
<video id="movie" width="640" height="400" autobuffer controls preload="auto">
<source src="/media/Archive_Videos/September%202013/September_13_U-RUN.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
<source src="/media/Archive_Videos/September%202013/September_13_U-RUN.webm" type='video/webm; codecs="vp8, vorbis"' />
<source src="/media/Archive_Videos/September%202013/September_13_U-RUN.ogv" type='video/ogg; codecs="theora, vorbis"' />
<object type="application/x-shockwave-flash" data="http://player.longtailvideo.com/player.swf" width="640" height="360">
<param name="movie" value="http://player.longtailvideo.com/player.swf" />
<param name="allowFullScreen" value="true" />
<param name="wmode" value="transparent" />
<param name="flashVars" value="controlbar=over&file=SITE%2Fmedia%2FArchive_Videos%2FSeptember%25202013%2FSeptember_13_U-RUN.mp4" />
<span title="No video playback capabilities, please download the video below">September 2013 U-RUN</span>
</object>
<p>OOPS! It looks like your browser doesn't support HTML5 videos. You can either install the latest version of your browser or download the video below:
<br />MP4 format | Ogg format | WebM format</p>
</video>
I also have an .htaccess file so it works in Firefox.
AddType audio/ogg oga ogg
AddType video/ogg ogv
Why isn't it working in IE 11?
What is the resolution of the video? I had a similar problem with IE11 in Win7. The Microsoft H.264 decoder supports only 1920x1088 pixels in Windows 7. See my story: http://lars.st0ne.at/blog/html5+video+in+IE11+-+size+does+matter
I believe IE requires the H.264 or MPEG-4 codec, which it seems like you don't specify/include. You can always check for browser support by using HTML5Please and Can I use.... Both sites usually have very up-to-date information about support, polyfills, and advice on how to take advantage of new technology.
I've been having similar issues of a video not playing in IE11 on Windows 8.1. What I didn't realize was that I was running an N version of Windows, meaning no media features were installed. After installing the Media Feature Pack for N and KN versions of Windows 8.1 and rebooting my PC it was working fine.
As a side-note, the video worked fine in Chrome, Firefox, etc, since those browsers properly fell back to the webm file.
I know this is old, but here is a additional thing if you still encounter problems with the solution above.
Just put in your <head> :
<meta http-equiv="X-UA-Compatible" content="IE=edge">
It will prevent IE to jump back to IE9 compatibility, thus breaking the video function.
Worked for me, so if you still have problems, consider checking this out.
Alternatively you can add this in PHP :
header('x-ua-compatible: ie=edge');
Or in a .htaccess file:
header set X-UA-Compatible "IE=Edge"
Although MP4 is supported in Internet explorer it does matter how you encode the file. Make sure you use BASELINE encoding when rendering the video file. This Fixed my issue with IE11
It was due to IE Document-mode version too low. Press 'F12' and using higher version( My case, above version 9 is OK)
In my case Codec ID of mp4 file was the issue, Codec ID: isom (isom/iso2/avc1/mp41)
was not playing in IE 10 and 11 using video tag, after I converted it to "mp42 (mp42/isom/avc1)" using FFmpeg it started playing in IE as well.
I used MP4Box to decode the atom tags in the mp4. (MP4Box -v myfile.mp4) I also used ffmpeg to convert the mp41 to mp42. After comparing the differences and experimenting, I found that IE11 did not like that my original mp4 had two avC1 atoms inside stsd.
After deleting the duplicate avC1 in my original mp41 mp4, IE11 would play the mp4.
I have set up a RTSP stream from my raspberry pi camera module using this:
raspivid -o - -t 9999999 |cvlc -vvv stream:///dev/stdin --sout '#rtp{sdp=rtsp://:8554/}' :demux=h264
I am able to view it using VLC with: rtsp://192.168.0.18:8554/
When I attempt to embed the video in a web page the video does not show.
<!DOCTYPE html>
<html><body>
<OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"
codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab"
width="800" height="600" id="vlc" events="True">
<param name="Src" value="rtsp://192.168.0.18:8554/" />
<param name="ShowDisplay" value="True" />
<param name="AutoLoop" value="False" />
<param name="AutoPlay" value="True" />
<embed id="vlcEmb" type="application/x-google-vlc-plugin" version="VideoLAN.VLCPlugin.2" autoplay="yes" loop="no" width="640" height="480"
target="rtsp://192.168.0.18:8554/" ></embed>
</OBJECT>
</body></html>
What is the best way to embed the video feed in HTML to view it in a web browser?
Well this is a bit tricky - when you open the RTSP link directly with VLC it should work since VLC comes packed with all the codecs (in your case H264). However I'm not aware of what happens with the browser plugin - does it reuse the codecs from the VLC installation or what. It could be that a codec is simply missing on the viewer's end but I'm not sure about that. Also, using the plugin you could run into issues with support among different browsers and whatnot.
The html5 video thing is a bit sketchy since as far as I remember (and this may have changed) neither live H.264 nor WebM is fully supported across all browsers. I'd still go with WebM since Chrome and Firefox has it and only IE requires an add-on. Check this question, it has a valid WebM streaming command line in the response and see if that works for you. If it does you should be even able to omit all the embed stuff and just use a plain HTML5 video tag.
I'm wondering if it's possible to make a browser play a AVI file within a video tag.
Everything I found on the web talking about it focus on MP4 and Ogg formats but nobody talks about the AVI format.
The only solution I found is to drop the video tag and make the video playable using JW Player.
Only the DivX web player can stream avi files. actually, theres a plug in for vlc to stream avi files also, but its buggy.
Sometimes it's a pain in the ass to get a solid answer. its one of the big sucks of the internet.
<object id="ie_plugin" classid="clsid:67DABFBF-D0AB-41fa-9C46-CC0F21721616"
width="660"
height="300"
codebase="http://go.divx.com/plugin/DivXBrowserPlugin.cab">
<param name="custommode" value="stage6" />
<param name="autoPlay" value="false" />
<param name="src" value="link-to-avi" />
<param name="bannerEnabled" value="false" />
<embed id="np_plugin" type="video/divx"
src="link-to-avi"
custommode="stage6"
width="660"
height="300"
autoPlay="false"
bannerEnabled="false"
pluginspage="http://go.divx.com/plugin/download/">
</embed>
</object>
note where it says "link-to-avi" twice :)
Today there are excellent approaches to deal with it. One of them is the module fluent-ffmpeg found on npm.
It requires the previous installation of FFMPEG
The support of avi isn't direct. It will be necessary build a server with node to serve your html.
Is there any way to play .wmv files using html5 video player?
There is no way. No browser (currently, if ever) supports playing wmv files. You will have to convert it into a format that browsers know how to play.
That's not true. Wmv files CAN play in IE with the windows media player object.
Example:
<object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" width="480"
height="360" codebase="http://www.microsoft.com/Windows/MediaPlayer/">
<param name="Filename" value="http://walkernewsdownload.googlepages.com/HP-iPaq-614.wmv">
<param name="AutoStart" value="true">
<param name="ShowControls" value="true">
<param name="BufferingTime" value="2">
<param name="ShowStatusBar" value="true">
<param name="AutoSize" value="true">
<param name="InvokeURLs" value="false">
<embed src="http://walkernewsdownload.googlepages.com/HP-iPaq-614.wmv"
type="application/x-mplayer2" autostart="1" enabled="1" showstatusbar="1"
showdisplay="1" showcontrols="1"
pluginspage="http://www.microsoft.com/Windows/MediaPlayer/"
CODEBASE="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,0,0,0" width="480" height="360"></embed>
</object>
You might need to install the Windows Media Player plug-in for your browser (if it is still available for your browser)
Credit: See http://www.walkernews.net/2008/08/17/windows-media-player-how-to-embed-wmv-file-in-html-code/ for a more thorough explanation.
AFAIK, the only way to play WMV files in a browser without resorting to embedding WMP is using Silverlight.
Mediaelement.js player documentation says, support to wmv and mov, but so far i have not seen any positive or success comments for these formats.Formats like wmv and mov are proprietary, so to play video user need to explicitly install browser based plugins. Latest version of Firefox doesn't support wmv directly, there is a work around.To support mov format,user need to have quicktime player install in the system.Go for players that supports Flash fallback for non HTML5 browsers.
WMV plugin for firefox
Firefox Documentation:
Heh, you would think IE would support it as WMV was a Microsoft format and IE is a Microsoft application. Interesting how they don't seem to mix.
Regardless, I hope that WMV will be supported in the future. Technically speaking, all current video formats except for OGG are proprietary. OGG is the only open platform codec.
Sorry, but actually isn't supported in google chrome, safari, Opera and firefox...
You can use any programs to pass WMV to MP4 files, supported :)
I hope this reply has helped you a lot!
How can I use pure HTML to make a browser-integrated flash-free online music player? Like, you click on a button, and the music starts playing. I have tried everything with <embed> and with(out) <noembed>, but none of it seems to work. I need it to work in Firefox.
I have an MP3 file.
EDIT: Actually, folks, I am SO sorry for asking this question. I have now seen that I simply had not written the path correctly. It all works quite fine with the <embed src="../../path/to/file.mp3" autostart="false" width="20" height="20"/> tag.
The thing is, I was trying to write it for browsers that don't support Flash, like e. g. iPad's Safari.
This ought to help. The HTML5 audio tag has decent support with newer versions of Firefox, Safari, Chrome, and Opera (sadly no Internet Explorer).
You may need to convert your .mp3 to .ogg or another format because certain browsers only allow certain formats.
Oh, you'll need Javascript for controls like .play(), .pause()...
I realize this is not an answer to the question per se, I am adding it for completeness.
This link has every possible permutation you can imagine...
I am not sure if the part below will work in FireFox:
Here is how to embed Windows Media Player into your HTML.
To embed an object in HTML document, the object class ID is required. The class ID for Windows Media Player 7, 9, 10 and 11 is clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6.
Insert the following code into your HTML document to embed Windows Media Player 7 and later:
<OBJECT id="VIDEO" width="320" height="240"
style="position:absolute; left:0;top:0;"
CLASSID="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"
type="application/x-oleobject">
<PARAM NAME="URL" VALUE="your file or url">
<PARAM NAME="SendPlayStateChangeEvents" VALUE="True">
<PARAM NAME="AutoStart" VALUE="True">
<PARAM name="uiMode" value="none">
<PARAM name="PlayCount" value="9999">
</OBJECT>
In the URL parameter, you can specify a URL (for streaming) or a local file.
I don't think this is possible yet (comes with HTML5).
You could use the Yahoo Media Player which works with Javascript.