Video cannot play in Ipad, but can play on desktop with using html5 video tag - html5-video

I'm using the html5 video tag to display the video call from database, but the video cannot display properly on ipad, just can display on desktop. Is it the video I calling by file path from my file server cannot support by my ipad?
Because i have do one exaple just place a video in the same folder with my .aspx file which are use to call the video. It can be work.
Example call in same folder:
<video id="myvideo" src="a.mp4" controls="true" width="703" height="400" type="video/mp4"></video>
Example call from file server:
<video id="myvideo" src="\\10.200.1.90\tgm_navi_fs\eNotice\General Notice\Article\UploadedVideos\11_140327133434_Nanotips.mp4" controls="true" width="703" height="400" type="video/mp4"></video>
src="\10.200.1.90\tgm_navi_fs\eNotice\General Notice\Article\UploadedVideos\11_140327133434_Nanotips.mp4"

It looks like the problem is that the iPad thinks you're trying to access a local file, and iOS doesn't allow users direct access to the local file system. (You'll notice, iOS apps don't generally ask you to load or save work in a folder the same way desktop apps do.)
You probably need to set up a HTTP server (a.k.a. "web server", like Apache, etc.), either on the file server itself or on another machine that has access to the file server. Then you need to change the URL to use the http protocol.
So, for example, let's say you set up your web server on the file server machine and set the root to "\tgm_navi_fs\eNotice\General Notice\Article\". The video tag would then look like:
<video id="myvideo" src="http://10.200.1.90/UploadedVideos/11_140327133434_Nanotips.mp4" controls="true" width="703" height="400" type="video/mp4"></video>

There can be a lot of reasons why the video isn't playing.
You should always provide (a piece of) your code with your question so it's easier to see what is going on.
A few things that might help you:
The HTML5 video tag is not properly set up. Look at the code at Video for everybody!. There is also a lot more info on HTML5 video's in general.
The video doesn't have the right encoding for iOS (iPad). Try Miro Converter on you MP4 to convert it to an iOS compatible MP4.
The server is sending a wrong or no MiME type. Make sure you are sending the right MIME types by putting the following in your .htacces for example.
.htaccess video MIME Types:
AddType video/mp4 f4v f4p m4v mp4
AddType video/ogg ogv
AddType video/webm webm
AddType video/x-flv flv
The flv is usually used for a Flash fallback by plugins like MediaElementJS.

Related

Html5 videos not displaying

I have a couple of videos uploaded to Hostgator (my hosting service), and I'm displaying them on a page with the HTML5 video player. The video is there (I know because I can hear the audio,) but in Chrome all I see is a black screen, and in Firefox it won't play at all, just says "No video with supported format and MIME type found."
The video files are both ones I had to convert from a .mov to a .mp4. But they are all mp4 files.
When I download the videos again from Hostgator, they are normal, so I don't think anything is wrong strictly with the files themselves.
What could be going wrong here? Thank in advance.
I suppose the issue is in wrong codec. It should be h.264 for MP4 file.
Source with instruction http://www.freemake.com/how_to/how_to_create_and_embed_html5_video
Web video is complicated, most browsers support different video formats (codecs). To be compatible with all browsers you need every video in 3 different file formats: MP4, OGG, WEBM.
For maximum compatibility, here’s what your video workflow will look
like:
Make one version that uses WebM (VP8 + Vorbis).
Make another version that uses H.264 baseline video and AAC “low complexity” audio in an MP4 container.
Make another version that uses Theora video and Vorbis audio in an Ogg container.
Link to all three video files from a single element, and fall back to a Flash-based video player.
<video width="320" height="240" controls>
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
<source src="video.ogv" type="video/ogg">
</video>
Source: http://diveintohtml5.info/video.html#what-works

IE10 audio element doesn't play my AAC (m4a)

IE10 audio element doesn't play my AAC (m4a) files.
Should it? the content type of the files is "audio/aac".
When I check:
audio.canPlayType("audio/mp3") --> TRUE
audio.canPlayType("audio/aac") --> FALSE
audio.canPlayType("audio/m4a") --> FALSE
I thought it should but why it doesn't?
I convert my files to AAC because of IE10 and mobile safari that don't support OGG. Safari Mobile plays this AAC files well.
See the Remarks section in http://msdn.microsoft.com/en-us/library/ie/ff975061%28v=vs.85%29.aspx
Beginning with Internet Explorer 9, any audio or video content needs the correct mime type set on the server, or the files won't play. Internet Explorer 9 and later support MP3 audio, and MP4 audio and video. [...]
Media file to serve Extension setting Mime type setting
...
Audio mp4 m4a audio/mp4
...
So you need to check for audio/mp4 in your code, and also make sure that your server sends this mime-type in the content-type header.

IE10 not playing a video when using the <video> tag, but plays it when requesting the video directly

I have a webpage with a tag on it with the following markup:
<video width="456" height="360" controls autoplay>
<source src="Movies/Intro.mp4" type="video/mp4" />
<source src="Movies/Intro_H264.webm" type='video/webm; codecs="vp8.0, vorbis"'/>
<source src="Movies/Intro_H264.ogg" type='video/ogg; codecs="theora, vorbis"'/>
</video>
If I visit this page in IE10 it renders the video player but with an error message that reads: "Error: unsupported video type of invalid file path"
But what's odd is if I right-click on the video box and choose, Copy video URL, and then open a new tab in IE and paste in the direct URL to the video file (Movies/Intro.mp4) it plays in the browser without issue.
Also, I can visit the page using Chrome and it plays the MP4 video from the webpage without issue. All that to say, I don't think there's any issue with the video file itself or the encoding, but why is IE 10 not playing the video when it's in the tag, but it is playing it when requesting the video directly?
Any insights?
Thanks
I would check whether the mime-type is correctly being returned for the file.
Chrome will play correctly regardless of the MIME Type returned.
To check:
Press F12 to display the IE Tools Window/Pane.
Go to the Network Tab
Click Start Capturing
Browse to the page in question
Find the mp4 line
If the Type is displayed as application/octect-stream then this is your issue.
I had the same issue with IE 11 and the problem was the content type was application/octect-stream as stated by csmith. I was serving my videos from Azure storage and apparently that is the default content type.
You can change the type with Azure storage or using Azure api as shown in the post
Set Content-type of media files stored on Blob
Here is a guide for people on Amazon cloud (I did not test it)
Changing content type for Amazon
Make sure you set the web server to use MIME type video/mp4 for .mp4. I accidentally set .mp4 to use MIME type video/mpeg, the video plays in Chrome, but not in IE11.
I had this same issue which was a real pain in the ass. My solution was actually quite simple (after searching on the internet for about 4 hours).
Add this line (specific for IE) to your .htaccess file.
AddType video/mp4 .mp4 .m4v
When you paste the URL to your browser it doesn't use HTML5 player anymore, so it doesn't say that it is really a supported file; only that the file path should be valid.
According to wikipedia, IE10 supports (not only) H.264 for video and AAC for audio - these are very common formats for mp4 container. Chrome's support is much wider (video- and audio-wise).
The problem is that the Intro.mp4 file might have different formats altogether (the file could by just renamed or created using unsupported formats).
I'd look into the file using properties->details or third party programs (for example Media Info).
I don't think it is IE10's issue. The only similar one I've found is when the user was too specific using unsupported format of used codecs ([...] type='video/mp4; codecs="H.264, AAC"' [...]).
Now it is very easy to update mime type for your videos on amazon s3,
Just login and navigate to your file, under preferences you will see metadata, there you can edit content-type
Save it and reload your page.
If it directly plays find when you put the .mp4 URL into the browser make sure it's not running with the Quicktime plugin which you may have installed (especially if you use iTunes). Right click on the successfully playing video to rule that out. If it comes up with menu items related to Quicktime you may want to disable Quicktime plugin in adins and continue troubleshooting.
Sample MP4 video: http://www.w3schools.com/html/mov_bbb.mp4

Using MP3s in Ektron

Ektron 801 SP1
I am allowing users to upload MP3 files to their profile using the CommunityDocuments control. I want the user to be able to click the link and play the song. For some file types, such as .doc, the file downloads immediately because the URL of the link refrences "DownloadAsset.aspx". The MP3 files have a URL like http://www.domain.org/documents.aspx?id=242665652917&TaxonomyId=242665652152&LangType=1033&EkTB_iframe=true&height=520&width=790
How can I get these files to play? I have the following in the web.config
<add key="audio/mpeg" value="WindowsMedia"/>
As far as I know, Ektron doesn't provide any player / plugin support ootb for MP3 files. You can specify an additional MEDIA type in the web.config, perhaps. Or use HTML5 Audio. http://www.w3schools.com/html/html5_audio.asp
When using the HTML5 approach, pay attention to which codecs are supported by which browsers. You'll have to work out something else for older browsers via fallback or shim.
Adding a MEDIA type in the web.config will just tell the browser to load a plugin like quicktime or wmp, if it works at all.
As per eGandalf's answer, Ektron doesn't include an MP3 player. You should still be able to use Ektron to store and the serve up the MP3, by saving it into the library or as a DMS asset. You made need to update an Ektron config setting by adding ".MP3" to a file extension whitelist.
Regarding having a user player the MP3 in the browser, I would look at using JW Player - it's very popular and here is a tutorial on using it to play an MP3.

HTML5 Video Error - Internet Explorer 9

I am trying to get a .m4v video to play in IE9 using html5 video tags. When I play the video from a remote location it works fine:
<video src="http://www.jplayer.org/video/m4v/Big_Buck_Bunny_Trailer_480x270_h264aac.m4v" controls="controls">
</video>
But when I want to play it from my server...
<video src="Big_Buck_Bunny_Trailer_480x270_h264aac.m4v" controls="controls">
</video>
...it only works in Chrome and not in IE9.
What could cause the video not to play when located on my server?
Many thanks,
Chris
I have found the problem. IE9 RC was seeing the video as plain/text and not video/m4v so it was not able to play. Chrome and IE8 read the file correctly.
Adding AddType video/x-m4v .m4v to my htaccess made sure IE9 RC was able to read it as a video/mp4 file.
Crazy eh?
In order for your server to associate the correct MIME types with the application, you will need to include the MIME types into your htaccess file.
Here is an example of several MIME types that you can include within your .htaccess file:
#Video MIME Types:
AddType video/m4v .m4v
AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm
In addition to needing the server to send the correct Content-Type header for the requested video file itself, you should consider using a child <source> tag instead of the src attribute, eg:
<video controls="controls">
<source src="Big_Buck_Bunny_Trailer_480x270_h264aac.m4v" type='video/x-m4v; codecs="..."'>
</video>
That will allow you to specify up-front the actual video type information so the browser can decide whether to even download the file at all. As well as give you flexibility to offer additional video types later on, if desired.