I am trying to open m.youtube.com using an ordinary browser but to be able to play the videos using HTML5 (instead of the default RTSP playback). To do that, I spoofed User-Agent in Firefox, and added there a string corresponding to iPhone's Safari UserAgent string. After I've done that, I see a nice "iPhone-like" version of the Youtube (instead of an ordinary m.youtube.com for other mobile devices). But the video, when selected, is not being played (on a "User-Agent-spoofed" Safari i can hear only sound, on "spoofed" Firefox the video is hung with a spinning "video is loading" icon). Why that might happen? what kind of features of Safari for iOS HTML5 version of youtube site may use that the video is not played in desktop Safari and Mozilla?
I have checked the Desktop browser requests and responses with Wiresharked, and found the GET request which corresponds to the video asked (the request's Content-type is video/mp4). But the playback works always only on the iPhone's Safari.
What may be the reason? I tried to look into HTML5 code of the Youtube page that contains video player, but there's so much JavaScript (most of HTML is being generated dynamically) that I got lost in it.
Is there any way to make it work on ordinary browsers (I can modify the requests/cookies on-the-fly)? I'd like to have an iPhone-styled youtube with HTML5 on my desktop browser.
Thank you
Related
Is there any library that sequences images and audio playback? I'm guessing that's the only way this could work..
Which picture formats would work best? I'm guessing that pictures wouldn't be as compressed as a video, but this example loads instantly for me:
Demo: Autoplay Inline Video iOS
Planning to just convert the video with ffmpeg. Any knowledge and advice would be great before I get started. Thanks
I believe that since iOS 6.1 you can no longer autoplay videos.
Referring to this stackoverflow post
"Apple has made the decision to disable the automatic playing of video on iOS devices, through both script and attribute implementations.
In Safari, on iOS (for all devices, including iPad), where the user may be on a cellular network and be charged per data unit, preload and auto-play are disabled. No data is loaded until the user initiates it." - Apple documentation.
I'm using this example http://threejs.org/examples/#webgl_video_panorama_equirectangular
For a panoramic video player using Three.js which is fine on desktop, but doesn't render on mobile. Just get a black screen and the following warnings:
three.min.js:573 THREE.WebGLRenderer: OES_texture_float extension not supported.
three.min.js:573 THREE.WebGLRenderer: OES_texture_float_linear extension not supported.
three.min.js:573 THREE.WebGLRenderer: EXT_texture_filter_anisotropic extension not supported.
Is there any way to this working on mobile - or am I doomed.
Most of mobile browsers disabled autoplay by default, it requires user interaction (e.g. a click event) to start the video. I believe it's a good intention to save initiate data bandwidth.
Safari HTML5 Audio and Video Guide
Warning: To prevent unsolicited downloads over cellular networks at the user’s >expense, embedded media cannot be played automatically in Safari on iOS—the user >always initiates playback. A controller is automatically supplied on iPhone or >iPod touch once playback in initiated, but for iPad you must either set the >controls attribute or provide a controller using JavaScript.
You just need to create a playback button like below, which is working on my Nexus 7.
playbackButton.onclick = function(){
video.paused ? video.play() : video.pause();
}
For iOS, it's a bit tricky. First issue you would have to deal with is the video format support. The example is using webm which is currently not supported. See Can I Use WebM for more support detail .
Good news is that switch to mp4 format this will work half-way. iOS Safari has its own native fullscreen video player which will take over the screen with video content instead of three.js rendering, so basically you would need inline video player solution (e.g. www.brid.tv/in-page-mobile-monetization/) or js-based currentTime trick (e.g. pchen66.github.io/Panolens/examples/panorama_video.html).
Hope this answers your question. :)
I'm using a latest flowplayer, and i'ved created couple of buttons that provides video source from cdn. With the click event the player should load the video source dynamically. But for some reason flowplayer cant unload and load the source of video properly. Instead I get the following error
html5: Video file not found
function flow(source) {
jQuery("#flow").flowplayer().unload();
jQuery("#flow").flowplayer().load(source);
}
alternatively I've tried to re-init the flowplayer with every click, but sometime the initial video get loaded instead of the clicked video source. After couple of clicks the flowplayer also get stuck on loading screen.
http://jsfiddle.net/qAj8x/
If you are using chrome for this purpose then from here . Chrome and Flow Player dose not go well together.
Native fullscreen is supported in Chrome 15+, Safari 5.1+ and Firefox 14+ and others will use full browser window. In Firefox 9+ the fullscreen is disabled and needs to be manually enabled at about:config (full-screen-api.enabled;true).
Some Chrome versions have issues with playing MP4 content. Workaround: List a WEBM before the MP4 source and/or set preload="none" as video tag attribute.
Chrome gets stuck when trying to load the same video twice, even in two different tabs.
I have been looking for an answer to this for a while with no luck. This SO question gives a lot of detail to the problem I am having, but is unanswered:
I'm trying to embed a video on a website that will play on blackberry
and windows mobile 6.5 devices (currently testing on a blackberry
curve and acer betouch) but don't seem to be getting anywhere.
Blackberry Flash doesn't work, and HTML5 video doesn't either. I can
play video in the browser on youtube so can see that it is possible -
using third party services like youtube isn't really an option either.
Windows mobile 6.5 Same deal really, though I think Flash is the way
to go (http://www.adobe.com/software/flash/about/ says the device has
flash version 9.1.something installed) but still just getting a little
triangle with a 9 in when I test it.
My question is: How would I embed a video to a webpage for blackberry and windows mobile?
I think that using the <object> tag would be safest, as Blackberry and Windows Mobile devices should both support it. Here's a link to the Blackberry developer blog, where they explain embedding video/audio objects so they are viewable on a Blackberry device. This method should work for Windows Mobile devices as well:
http://docs.blackberry.com/en/developers/deliverables/6176/HTML_ref_object_564145_11.jsp
For a full overview of HTML 5 video and flash fallback (to support all devices) consider reading here..
http://diveintohtml5.ep.io/video.html
Vorbis OGG may be the safest bet..
I currently have a simple flash Mp3 player on my site which works lovely. The issue is, most cell phones do not support flash and a large portion of my visitors come through via a mobile device. The alternative to this is to replace the flash player with a javascript player. I found a JQuery one but it only works on HTML5 compatible browsers. Does anyone know of a good alternative that would work on mobile devices as well as most desktop web browsers?
You can check if the browser supports the HTML5 audio tag if not, use the flash version.
Check out jPlayer.