I work on a testing website that allow users to upload audio and video. In local server, everything is fine. The users can upload audio and video and play audio or video as they want. But after deploying the website to windows azure, the video does not work. The users in the azure server can upload audio and video, but they can only play audio. When trying to play video, an error message say (NO video with supported format and MIME type found).
In html, I use these to display video
<video id="Video" controls="controls">
<source src="#Url.Content("~/Video/"+VideName)" type="video/mp4" />
Your browser does not support HTML5 video.
</video>
I check the server to see if the video files are exist, but the files are exist there.
What is the problem ? Does azure refuse the request for video ?
Probably Azure does not recognize your deployed video files as static content. Try to add the following lines in your web.config file:
<staticContent>
<remove fileExtension=".mp4" />
<mimeMap fileExtension=".mp4" mimeType="video/mp4" />
</staticContent>
It should be placed in system.webServer section.
Related
I want to play video file in my application, so I write below code for the same
<video width="640" id="videoPlayer" style="background:black" autoplay controls>
<source src="/cam01/2017-11-07_17-04-25.mp4" type="video/mp4">
<p>Your browser does not support the video tag.</p>
</video>
The cam01 folder is in Tomcat's webapp directory (/apache-tomcat-7.0.70/webapps/cam01), but I'm getting following error in console log
Even when I'm trying to hit url http://localhost:8080/cam01/2017-11-07_17-04-25.mp4 directly on browser to see video, I'm getting following error...
Here is how you can play videos on a page from the local directory or remote directory:
<video src="[ YOUR VIDEO ].mp4"
controls
width="720" height="480">
Your browser does not support the video element, please #D try downloading the video instead
</video>
Please check the compatibility of the browser that your trying to test playing in through:
https://caniuse.com/#search=video
The current state of support for the element is below:
It is also preferred if you could play webm format instead of mp4.
If it still does not work make sure you have flash installed.
https://get.adobe.com/flashplayer/
I'm struggling to get simple audio playback. I've got a list of tracks, each at unique url's that I would like to play when a user presses the associated play button. I've attempted soundmanager2 and jplayer but couldn't get it to work for my use case (desktop browser and ios). I have fallen back to straight up html5 with the code as follows
<audio controls>
<source src="/path/to/file" type="audio/wav">
Your browser does not support the audio element.
</audio>
This works perfectly in desktop chrome and desktop safari. In ios chrome and ios safari (latest) the player isn't presented, but instead a message within a grey box saying "Cannot play audio file" is presented.
Am I using this tag correctly? How can I overcome these errors?
Update 1
I am sending the wav file from google appengine (as a blob). I have found that safari cannot play unless I add .wav to the end of the src - despite the src just being an indirect link to the file. The actual file returned does end in .wav but Safari isn't smart enough to recognise this.
Update 2
The following works in all browsers (mentioned above) - so it is not specific to wav files.
<audio controls preload="metadata">
<source src="http://www-mmsp.ece.mcgill.ca/Documents/AudioFormats/WAVE/Samples/AFsp/M1F1-Alaw-AFsp.wav" type="audio/wav">
Your browser does not support the audio element.
</audio>
I've sent the file from google app engine as both a MIME attachment and a raw response but it makes no difference.
Update 3
I've swapped in a longer wav file (http://www.villagegeek.com/downloads/webwavs/ever_again.wav) and this too is unable to play (on ios). It isn't clear if it's because of the length, size or some other variable.
Update 4
I've ruled out size being the issue because this 24s wav file works
<audio controls preload="auto">
<source src="http://www.dailywav.com/sites/default/files/wavs/dontlikelaughing.wav" type="audio/wav">
Your browser does not support the audio element.
</audio>
Update 5
So I'm serving the file from a google cloud storage bucket. When saving the file I'm not specifying the MIME type and as a result it is being returned as binary/octet-stream. The desktop browsers are smart enough to overcome this, but the mobile browsers are not.
So I'm serving the file from a google cloud storage bucket. When saving the file I'm not specifying the MIME type and as a result it is being returned as binary/octet-stream. The desktop browsers are smart enough to overcome this, but the mobile browsers are not. The answer to the above question is therefore to set the MIME type for the relevant file upon writing to GCS.
I use HTML5 to play mp3 file on iPad.
I put two audio tags:
One use audio source from
http://www.schillmania.com/projects/soundmanager2/demo/_mp3/office_lobby.mp3
The other is from my local nginx server, the mp3 file is download
from
http://www.schillmania.com/projects/soundmanager2/demo/_mp3/office_lobby.mp3
After I click play button on audio player controls, both of them can play.
The remote one can playback; but mp3 from my local nginx can't playback, it always shows 'streaming...' even after the mp3 playing is done.
The HTML5 code is below:
<p>Remote</p>
<audio controls="controls">
<source src="http://www.schillmania.com/projects/soundmanager2/demo/_mp3/office_lobby.mp3" type="audio/mpeg" />
Audio not support!
</audio>
<p>Local Nginx</p>
<audio controls="controls">
<source src="http://192.168.1.100/office_lobby.mp3" type="audio/mpeg" />
Audio not support!
</audio>
I want to know why two audio controls behave diffrently.
Is it nginx configuration problem?
Similar problems happened for me too.
You may check the audio URL directly in the browser. If you meet "403 Forbidden" issue, that means your local mp3 has wrong permission.
Hope it's helpful.
Or open them in a UIWebView? Their videos are in .swf format though.
Thank you.
EDIT: Okay, so I can get it to play in UIWebView, also when you click on the video in the UIWebView it will play the video in fullscreen. So am wondering if I can just get the code of when it clicks to fullscreen, and use it in some button I have.
Did that make sense?
Oh and thank you again.
Try embed the iframe snippet from Youku into your webview
<iframe height="498" width="510" frameborder="0" allowfullscreen
src="http://player.youku.com/embed/XNTY4ODU0NzQ0"></iframe>
I got it working on Android, but not tried it on iOS yet.
<video width="480" height="320"
src="http://v.youku.com/player/getRealM3U8/vid/XMzkxMTM3MDQw/type//video.m3u8"
controls>
<embed src="http://player.youku.com/player.php/sid/XMzkxMTM3MDQw/v.swf"
allowFullScreen="true" quality="high" width="480" height="320"
align="middle" allowScriptAccess="always"
type="application/x-shockwave-flash"></embed>
</video>
Just use the above HTML in a UIWebView for Youku. It can be played on iOS device and PC. Replace the XMzkxMTM3MDQw with the corresponding code of the video.
As you will easily be able to verify on the internet, Flash (.swf) is not supported on iOS devices. Maybe they offer their videos in another format, otherwise this won't work.
Update: I guess you're just opening the website in your web view. So that means on their web site they have an iOS compatible stream. You can fetch the stream data from the website's source code and build your own web site (stored locally on the device) that only displays that video stream in an UIWebView. Or you use MPMoviePlayer or HTTPLiveStream, whatever. However, make sure that this is allowed/legal, I can't help you there since I guess it heavily depends on what you want to do with your app.
See here to get the url of .m3u8 file for a youku video by its ID, and simply embed it into a <video> tag
I'm trying to have a .m4v file play as a failover since IOS still won't allow Flash. I can play the .m4v file on Windows through a few browsers, but even if I go directly to the .m4v file on my server from an iPad it won't play. All I see is a black screen.
I have the debug console open and I don't receive any messages or see any content.
I deployed the .m4v file on my personal web server and can play it from there. The MIME type is correctly set.
This is the MIME type:
.m4v = video/x-m4v
What else could be wrongly set?
Here is an example of my HTML:
<video id="movie" width="320" height="240" preload controls>
<source src="/SurroundHealth/videos/sample_ipod.m4v" />
</object>
<div class="fallback">
<p>You must have an HTML5 capable browser.</p>
</div>
</video>
Here is the url:
http://dev.surroundhealth.net/surroundhealth/videos/test.html
Modify the MIME type to read application/octet-stream instead of video/mp4 - worked for me!
I think your mime type is incorrect and it should be:
.m4v = video/mp4
References:
http://en.wikipedia.org/wiki/MPEG-4_Part_14
Never figured this out, so we put the video on youtube