videojs / video.js

Video.js - open source HTML5 video player
https://videojs.com
Other
38.04k stars 7.45k forks source link

Live Streaming- HLS + RTSP + Wowza #1524

Closed TelecomCoder closed 10 years ago

TelecomCoder commented 10 years ago

Hi,

I am using a Wowza's Gocoder application to live stream video from my iPhone to the Wowza server(version 4.0.4). From the server I was able to fetch the video to my Webpage as well. I used Video.js player to do the same. But all this works only for IOS (HLS stream). Now, I would like to know if I could support streaming from my Android mobile (RTSP) as well using the same player. "The code is attached as an image".

github_pic

Is there something I could include to make the single player connect to the RTSP or HLS stream respectively?

Thank you for the help ! :)

mmcc commented 10 years ago

Hi there, we don't support RTSP, but HLS works pretty well for a large number of Android devices. I would suggest using the contrib-hls plugin, and make sure you set the appropriate mime-type of the video. You currently have an HLS source with a mime type of video/mp4, but it should be application/x-mpegURL or application/vnd.apple.mpegurl.

For future reference, you can post code samples by using backticks around the code, like this:

<b>This is a code sample</b>

Also, this is very similar to an issue you already posted: #1515. Please avoid opening a new issue when you can just comment on an existing one. Even if it's closed, we still get the emails and can still help :)

TelecomCoder commented 10 years ago

Hi Mathew,

Thank you for your response and heads up !. So, if I change the mime type to either application/x-mpegURL or application/vnd.apple.mpegurl, I should be able to stream HLS to both IOS and Android devices ?

Thanks, Monica

mmcc commented 10 years ago

Not necessarily, those are just correct mime types. That's especially important if you wanted to use the Video.js HLS plugin for Flash playback across desktop browsers.

Regarding Android support, Android HLS support is pretty touch and go. 3.0 tried to support it (and some devices kinda do), but decent support didn't really come until > 4.0.

TelecomCoder commented 10 years ago

Hi mathew,

I got video.js (embedded on my webpage) working on both Android and IOS streaming live video using Wowza. Now, I would like to detect if the device is Android or IOS and perform the action accordingly. I was successful with the detection as I tested it by displaying an alert message. But, when I try to stream the video, it does not seem to work and is quite confusing.

<script>
var isMobile = {
    Android: function() {
        return navigator.userAgent.match(/Android/i);
    },
    BlackBerry: function() {
        return navigator.userAgent.match(/BlackBerry/i);
    },
    iOS: function() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i);
    },
    Opera: function() {
        return navigator.userAgent.match(/Opera Mini/i);
    },
    Windows: function() {
        return navigator.userAgent.match(/IEMobile/i);
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
    }
};
</script>
<script>
if( isMobile.iOS() ) 
{
<!--WRONG-->
<div style="text-align:center">
<video id="example_video_1" class="video-js vjs-default-skin vjs-big-play-centered" style="margin: 0 auto;" controls preload="auto" width="1000" height="600"
  poster="nfllogo.png"
  data-setup='{"example_option":true}'>
<source src="http://a.b.c.d:1935/live/myStream1/playlist.m3u8" type='video/mp4'/>
 <p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a></p>
</video></div>
}
else if( isMobile.Android() ) 
{
location.href = "rtsp://a.b.c.d:1935/live/myStream1"
}
</script>

I want to embed the video.js player in the case of IOS and in the case of android, just display the player. How am i supposed to embed the player inside the Javascript code ? Everywhere I see, there are only instructions to embed the video using the

Thanks, Monica