I have tried everything I possibly could, but I was not able to solve this. I am trying to display an mp4 video using an HTML5 video element in IE9 and IE10. In IE9 I get a blank square where the video is supposed to show and in IE10 it says "Invalid Source". It plays fine in Chrome.
The video displays fine within a simple HTML file, but not in my ASP.net MVC project, whether run locally or on a web server. I have the file placed in my root folder (same folder as the web.config)
Here is my code in my ASP.NET MVC index.cshtml:
<video controls style="position:inherit" >
<source src="ExplainerVideo.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
</video>
Any ideas?
Thanks.
Try taking away the codec and letting the browser decide for itself whether it can play it or not.
e.g. <source src="ExplainerVideo.mp4" type='video/mp4' />
Failing that, try an absolute URL for the video as I've noticed this causing issues on IE before.
Related
While trying to embed html5 <video> tag in my salesforce web Page, I came across a wonderful library called "Videojs" (http://videojs.com/getting-started/). It served most of the purpose, however when I tried to play a video on Ipad, it failed. Then I came across this link (VideoJS: not working on IOS), which says to try to use videojs's default movie as there possibly could be encoding issue. When I did as per the suggestion, I came with a very interesting scenario. As When I fed the url(http://vjs.zencdn.net/v/oceans.mp4) directly as:
<source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4" />
it worked fine both in windows and in ios. But when I downloaded the same video and saved it to Salesforce CRM Content libraries and gave the src path as:
<source src="/sfc/servlet.shepherd/version/download/id" type="video/mp4" />
it worked in windows desktop browsers but not on ipad(version 9.2). I couldn't understand the issue.
Thanks for any help/ideas/suggestions.
I am googling mostly encoding issue for mp4 file or hugesize file,so use handbreak (https://handbrake.fr/). solve the problem
I have a very similar question to Play a Shoutcast Stream on iPhone with HTML5, but with a few differences...
I have an Icecast server running on Ubuntu 14.04 LTS, streaming an mp3. The setup follows Icecast's documentation exactly, is linked from an <audio> HTML5 tag on a website running on AWS EC2 and works in my desktop / laptop browser.
However, when I try to load the same website in iOS, on either my iPhone or my iPad, the HTML5 audio player loads, shows "Loading..." for several minutes, then either displays nothing or "Error".
The HTML5 code is as follows:
<audio controls>
<source src="http://xx.xx.xx.xx:8000/example1.mp3" type="audio/mpeg" />
</audio>
Suggestions or ideas as to why this doesn't work in iOS?
I finally got this resolved, but realized I never posted an answer.
I had to set the <audio> src value to the streaming mount point found in my icecast.xml file.
So, in my icecast.xml file, I have:
<!-- You may have multiple <listener> elements -->
<listen-socket>
<port>8000</port>
<bind-address>123.456.789.012</bind-address>
<shoutcast-mount>/stream</shoutcast-mount>
</listen-socket>
Thus, my HTML5 <audio> tag became:
For good measure, I also included the mime_type of audio/mpeg and controls to the <audio> tag, though these are not required.
I am trying to embed a local mp4 file that resides on the same server where IIS runs but on a different disk and is not part of the site (too many videos to do that). For example, my site is under C:\inetpub\wwwroot\Site while mp4 files I'd like to play are under D:\Videos. User running the site has access to this location. When I put full path to the file in the source, video does not play. What is the best way to handle this?
<video width="640" height="360" controls="controls">
<source src="D:/Videos/VideoFile.mp4" type="video/mp4" />
</video>
You don't have the right to do that, you need virtual path and not a physical one just put mp4 file inside your project directory and then specify path as...
Try using 'http://[Your server]/directory/yourmp4.mp4' or use Server.MapPath() as src of your object.
and make sure your browser supports video tag as it is a html5 tag.
When I embed Youtube video on a page and test it locally nothing happens or the browser even locks up, depending on the browser. Publish the page, test online and it works fine. Obviously not an ideal develop/test scenario. I'm using the iframe embed code from Youtube.
It sure seems like a cross domain security issue but I see no errors using Firebug and haven't found any reference to that nor anyone with a similar problem. Probably just missing something but I'm stumped. I don't like being stumped... for long.
Example that works online but not locally even if this is the only code in the body:
<iframe width="640" height="360" src="//www.youtube.com/embed/INg83kArY4g?rel=0" frameborder="0" allowfullscreen></iframe>
BTW, no problem embedding and playing the same video locally when hosted on my own web server (not locally). Any help would be appreciated.
The reason that file will not load locally is because you are using a protocol relative URL when defining the src attribute.
When the browser parses the src it will prepend the scheme(http: or https:) that the page is viewed in. If the page is being viewed locally, your browser will prepend file to the URL and that will result in an invalid URL.
You can remedy the issue by inserting a scheme on the src e.g.
src="http://www.youtube.com/embed/INg83kArY4g?rel=0"
or by serving up that page on a local server.
Reference
Paul Irish
Try adding 'http:' to the beginning of the src attribute:
<iframe width="640" height="360" src="http://www.youtube.com/embed/INg83kArY4g?rel=0" frameborder="0" allowfullscreen></iframe>
I am new to MVC I want to know how to add Video in MVC 2.0 using Html5. when I try to add video in Mvc like this
Video src="http://stelllent/Videos/Mvc"
It display error Video tag is not defined.
The first prerequisite is to have a browser which supports the <video> tag (IE 9.0+, FireFox 3.5+, Safari 3.0+, Chrome 3.0+, Opera 10.5+, iPhone 1.0+, Android 2.0+, ...). Then you could use it like this:
<video src="/videos/movie.avi" controls="controls">
Your browser does not support the video tag
</video>
Or if you have a controller action which is streaming the video you could also point the src attribute to it.