I am developing a live video streaming solution for a client with the following requirements:
- Stream live video to high-end Android and iPhone devices, from a mobile-optimized web app (NOT native apps)
- The video should not be full screen but partial screen, so that other HTML content can be displayed below the video
So my question is, what is the video format/technology that allows live video streaming in both devices? I've heard about HLS but I am not sure it plays in both devices.
And also, is there a way to prevent the video from going full screen? I've come across this in SO http://broken-links.com/tests/video/, but it's for on demand video. Could it also apply for live video streaming?
Thanks in advance
You should set allowsInlineMediaPlayback attribute of your UIWebView instance to YES for iOS.
From Apple's UIWebView reference page:
allowsInlineMediaPlayback
A Boolean value that determines whether HTML5 videos play inline or
use the native full-screen controller.
#property(nonatomic) BOOL allowsInlineMediaPlayback Discussion The
default value on iPhone is NO.
In order for video to play inline, not only does this property need to
be set on the view, but the video element in the HTML document must
also include the webkit-playsinline attribute.
For Android, AFAIK default behaviour of Android's WebView is not triggering media player with fullscreen. You should be able to use WebView as is.
You can get information about supported video formats with those links:
iOS Media Layer Supported Video Formats
Android Supported Video Formats
There are two major industry standards, I guess it won't be a problem if I understand your concerns correctly.
Hope that helps.
Related
I want to make a react-native app having the capability of video streaming from a mobile app to a connected browser user. On top of that, I want to overlay some application components so connected users can see video streaming as well as some of the application UI.
For an example take a reference of the below-given image. Here, video streaming is running in the car showroom and there are a few app components shown as an overlay of the video like an app menu and a car image.
I want to achive same functionality and using VideoSDK platform for video streaming service.
So far I have created react-native app and able to stream video through camera to the connected browser user.
Next, I want to add my app menu on top of the video as per the image and therefore i am thinking screenshare with combination of video sharing is way to go.
The above image is the actual implementation using video SDK in the browser but as you can see screen share window is opening in a totally different context which is not the expected implementation.
Can someone suggest how can I achieve the functionality of video streaming having the capability of app overlay components?
I have reviewed your requirement and I am glad to inform you that we do have application with same requirements, for further discussion and demos can we connect over mail i.e. karan10010#gmail.com
I'm developing a web application with AngularJS and I'm using a directive for embedding responsive Youtube videos called youtubeResponsive which allows to embed videos in an iframe with a video id as source parameter.
It all works perfectly on desktop browsers, in fact I also managed to embed a playlist and play it in a loop.
The problem I'm having is now on Chrome Android, on a Nexus 5 device (running Lollipop latest update) the video embedded is not showing and instead I can see a notification of a download going on. Every time I refresh I see the download process restarting but no video is showing. If I click on the download notification to see the file nothing happens.
Of course my aim is to display the video also on mobile with autoplay and loop active.
The output which I can see inspecting the page on mobile using USB debugging (chrome://inspect/#devices)
<iframe id="ytplayer" type="text/html" width="100%" height="202.5" ng-src="http://www.youtube.com/v/ZhfUv0spHCY?version=3&autoplay=1&loop=1&controls=0&showinfo=0&rel=0&wmode=opaque" frameborder="0" allowfullscreen="" video-slug="ZhfUv0spHCY" class="ng-isolate-scope" src="http://www.youtube.com/v/ZhfUv0spHCY?version=3&autoplay=1&loop=1&controls=0&showinfo=0&rel=0&wmode=opaque"></iframe>
I don't see any error on mobile except the same warning I can see on desktop which apparently is not blocking the video from playing at least there.
Resource interpreted as Document but transferred with MIME type application/x-shockwave-flash:
"https://www.youtube.com/v/ZhfUv0spHCY?version=3&autoplay=1&loop=1&controls=0&showinfo=0&rel=0&wmode=opaque".
Anyone experienced the same issue on Android Chrome or on other mobile devices and OS ?
I haven't started testing on AOSP or iOS yet but already on Chrome the issue is quite concerning. Let me know if anyone managed to fix it.
You're specifically requesting the old Flash player widget and not allowing it to upgrade to HTML5, which is required now for mobile support of any kind. You should switch to the YouTube Player API, which requires a few extra lines of code to implement but will work almost anywhere and give you a lot of event data back about videos playing, etc.
https://developers.google.com/youtube/iframe_api_reference
You can still use an IFRAME with this technique, although consider this directive which appears to support the current API:
https://github.com/brandly/angular-youtube-embed
In Built Video Streaming Facilities Available in DOTNETNUKE?
DNN hasn't got any build-in video streaming. There are a number of modules that allow you to hook up to a video, show a (categorized) video library. You can store these video's locally on your site, or on some kind of service.
Personally, I have good experiences with vimeo (plus version). E.G. with Vimeo you can tweak the private settings in such a way that the video can only be played from you own site.
I'm writing an HTML/CSS jQuery Mobile app to be native-compiled for iPhone, Android and Blackberry using PhoneGap Build.
The app needs to play very short spoken word audio snippets, possibly in MP3 format. What are the options for maximum cross-device compatibility?
I understand there are problems with the HTML5 audio tag, and I've had a look at jPlayer but can't get it to work on iOS 4 where the player is added to a panel element.
Thanks
you will have to use the default media functions which included with phonegap itself ..
here is the link to the doc file
http://docs.phonegap.com/en/1.3.0/phonegap_media_media.md.html#Media
I am not able to play video on mobile device which is .3gp container and H.263 / AMR_NB encoded. I just want to play my website videos in mobile device also just like youtube.com. I want to use RTMP and HTTP both. My requirement is as follows-
Which codec and container will be best?
Should I use FLV to play video on mobile device?
RTSP required or can be use RTMP?
Is NetStream and NetConnection methods different from Flash Player in Flash Lite Player?
How to play 3gp video using RTMP stream ie. ns.play(“mp4:mobilevideo.3gp”, 0, -1, true) is it ok or any thing else required?
For mobile browser and computer browser, can I use single player or I have to make different player for computer browser and mobile browser?
It would be better if I can do it with single player for both mobile and computer browser.
Sample code required for testing. If you can.
I got below article in which they mention that we can play video 3gp container in mobile also. Please find the article.
Articles URL-
http://www.hsharma.com/tech/articles/flash-lite-30-video-formats-and-video-volume/
http://www.adobe.com/devnet/logged_in/dmotamedi_fms3.html
Thanks
Sunil Kumar
We've established that it's possible to play mp4 within a 3gp wrapper, but only if the file has an mp4 extension, and for Flash 9 onwards.
See http://www.adobe.com/eeurope/products/hdvideo/faq/
Hi I am not able to play video on mobile device which is .3gp container and H.263 /AMR_NB encoded. I just want to play my website videos in mobile device also just like youtube.com. I want to use RTMP and HTTP both. My requirement is as follows-
Which codec and container will be best?
Should I use FLV to play video on mobile device?
RTSP required or can be use RTMP?
.flv is not supported on all devices that support FL 3.0. Please refer to the following threads in the nokia discussion forum:http://discussion.forum.nokia.com/forum/showthread.php?p=731458#post731458 regarding transcoding in 3gp to be used in the rtsp server.
You can use http for flv.
Is NetStream and NetConnection methods different from Flash Player in Flash Lite Player?
I have no clue about this.
How to play 3gp video using RTMP stream ie. ns.play(“mp4:mobilevideo.3gp”, 0, -1, true) is it ok or any thing else required?
For the rtsp, you need to setup the darwin streaming server, which is pretty simple to install and then place your 3gp/mp4 files there. There is no need for a netstream object for this. You can simply use the 'play' method with the instance of the video object:
.play(<3gp_Or_mp4__file>);
For mobile browser and computer browser, can I use single player or I have to make different player for computer browser and mobile browser? It would be better if I can do it with single player for both mobile and computer browser.
No clue.
I would recommend you to look at the 3gp players official website at http://www.3gp-player.com .
You can read and get some information about playing 3gp video files on both Desktop/Laptop computers, and cellphones/mobile devices.
Most of the tools offered there are free, and so is the information about all the 3gp player / converters.
Hope this helps you.