wowza stream to JW player HTML5

Question

Question by river jack · Jun 04, 2012 at 03:08 PM · media players and devices

wowza stream to JW player HTML5

hello,

I try to get the wowza stream to JW Player 5.9 with HTML5 mode.

Unfortunately, it does not work. It falls back to download.

Is 'provider': 'video' correct? Is the playlist URL correct?

/live/lq/playlist.m3u8 is Video H264 MPEG-4 AVC and Audio: MPEG AAC (mp4a) (says VLC)

(so, the URL basically works)

<script type='text/javascript' src='/jwplayer/jwplayer.js'></script>
 
<div id='mediaplayer'></div>
 
<script type="text/javascript">
  jwplayer('mediaplayer').setup({
    'id': 'playerID',
    'width': '480',
    'height': '270',
    'provider': 'rtmp',
    'streamer': 'rtmp://xx:1935/live/lq',
    'file': 'sintel.mp4',
    'image': 'http://example.com/thumbs/sintel.jpg',
    'modes': [
        {type: 'flash', src: '/jwplayer/player.swf'},
        {
          type: 'html5',
          config: {
           'file': 'http://xx:1935/live/lq/playlist.m3u8',
           'provider': 'video'
          }
        },
        {
          type: 'download',
          config: {
           'file': '/videos/sintel.mp4',
           'provider': 'video'
          }
        }
    ]
  });
</script>

the code is from http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/18530/embedding-an-rtmp-stream-with-an-html5-fallback

thanks for help!

0

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

1
2
›

Answer 1 · 2012-10-24T13:24:52Z

Answer by Richard Lanham · Oct 24, 2012 at 01:24 PM

You can make a visible playlist with JW player for the Flash side that includes live and vod items. I'm not sure about the iOS side, the phone's are too small for a display like that I think.

Richard

0 · Share

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Answer 2 · 2012-10-22T02:16:59Z

Answer by Randall Auriemma · Oct 22, 2012 at 02:16 AM

Hi multibc,

I do not know of a pre-made solution. But you could always develop something custom.

0 · Share

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Answer 3 · 2012-10-21T18:19:24Z

Answer by Martin Bals · Oct 21, 2012 at 06:19 PM

Hi,

this is all nice but I am looking for something like a visible playlist at the right site in a JWplayer that is supporting Live-rtmp at first in the playlist and then VOD. It should support PC and iOS in one player.

I use the transcoder so I have flv and mp4 and mp4 replays.

0 · Share

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Answer 4 · 2012-06-07T23:08:52Z

Answer by Randall Auriemma · Jun 07, 2012 at 11:08 PM

Hi riverjack,

Please do clarify what you're saying. I don't see anything about linux on that page. Probably if a video is working in HTML5 without Flash it is doing progressive download, and using some other codec than H.264/AAC. We're all wishing for an example of an HTML5 live player for H.264.

0 Show 1 · Share

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Peter Burke · Jun 08, 2012 at 10:22 AM 0

Share

JW player works fine for Flash rtmp / iOS HLS html 5 failover. Example here (FMS 4.5 server, but that's irrelevant to the player config - just replace URLs to your player files and the content and you're good to go in Flash and iOS):

https://nms.doit.wisc.edu/embedders/embedder.php?account=doit-nms&video_name=sintel_1000.mp4&video_width=640&video_height=282

code used there:

<script type='text/javascript' src=' https://nms.doit.wisc.edu/jw59/jwplayer.js'></script>;

<div id="mediaplayer" class="transparent">player should sit here</div>

<script type="text/javascript">

jwplayer('mediaplayer').setup({

'id': 'playerID',

'width': '640',

'height': '282',

'provider': 'rtmp',

'streamer': ' rtmp://flashstreamer.doit.wisc.edu/doit-nms/media',

'file': 'sintel_1000.mp4',

'plugins': 'captions-1',

'modes': [

{type: 'flash', src: ' https://nms.doit.wisc.edu/jw59/player-licensed.swf'},

{

type: 'html5',

config: {

'file': ' http://flashstreamer.doit.wisc.edu:8134/hls-vod/doit-nms/streams/media/sintel_1000.mp4.m3u8',

'provider': 'video'

}

},

]

});

</script>

Answer 5 · 2012-06-07T16:47:44Z

Answer by Richard Lanham · Jun 07, 2012 at 04:47 PM

Robert,

To fix rtmp playback, change this:

 'file': '/iel_videos/air-tires.m4v',

To this (remove leading forward slash):

 'file': 'iel_videos/air-tires.m4v',

And (to fix iOS playback) change this:

http://fss.education.illinois.edu:1935/vod/iel_videos/air-tires.m4v/playlist.m3u8

To this (add app instance "_definst_" because content is in subfolder):

http://fss.education.illinois.edu:1935/vod/iel_videos/air-tires.m4v/playlist.m3u8http://fss.education.illinois.edu:1935/vod/_definst_/iel_videos/air-tires.m4v/playlist.m3u8

Richard

0 Show 1 · Share

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Robert Croy · Jun 07, 2012 at 12:02 PM 0

Share

Thank you Richard. The forward slash was working for the Flash version but still works with out it. I had tried using _definst_ but I think I must have been putting it in the wrong spot in the URL. Now to get the iOS version to play on the Apple TV. Is this all I need to add to the HTML5 code:

'x-webkit-airplay': 'allow'

Answer 6 · 2012-06-07T14:45:44Z

Answer by Richard Lanham · Jun 07, 2012 at 02:45 PM

HTML5 video tag with m3u8 URL only works in iOS devices. The only desktop browser it works in is Safari on a Mac.

Richard

0 Show 2 · Share

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Robert Croy · Jun 07, 2012 at 10:32 AM 0

Share

I am having the same problem using the same code. I am trying to play the video on an iOS device. Here is my code:

<script type='text/javascript' src=' http://fss.education.illinois.edu/jwplayer/jwplayer.js'></script>;

<div id='mediaplayer'></div>

<script type="text/javascript">

jwplayer('mediaplayer').setup({

'id': 'playerID',

'width': '270',

'height': '204',

'provider': 'rtmp',

'streamer': ' rtmp://fss.education.illinois.edu:1935/vod',

'file': '/iel_videos/air-tires.m4v',

'image':' http://fss.education.illinois.edu/ber/gonzalez_poster.png',

'modes': [

{type: 'flash', src: ' http://fss.education.illinois.edu/jwplayer/player.swf'},

{

type: 'html5',

config: {

'file': ' http://fss.education.illinois.edu:1935/vod/iel_videos/air-tires.m4v/playlist.m3u8',

'provider': 'video'

}

},

{

type: 'download',

config: {

'file': ' http://fss.education.illinois.edu/vod/iel_videos/air-tires.m4v',

'provider': 'video'

}

}

]

});

</script>

In the wowza error log the entry is showing a file not found. Strange thing is that the folder iel_videos name is being stripped off in the error. I thought I had this working the other day but it doesn't seem to work now. Here is the stream:

http://fss.education.illinois.edu/testhtml5/

This code is on the link Wowza 3.

Robert

river jack · Jun 07, 2012 at 11:56 PM 0

Share

HTML5 video tag with m3u8 URL only works in iOS devices. The only desktop browser it works in is Safari on a Mac.

Hi Richard,

this player is working also on the linux maschine without flash, no iOS

http://www.longtailvideo.com/players/

So I think it should be possible..?!

Answer 7 · 2012-06-07T14:27:59Z

Answer by Richard Lanham · Jun 07, 2012 at 02:27 PM

JW player is a Flash application. It won't work if the Flash plugin is not installed on the client machine

Richard

0 Show 1 · Share

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

river jack · Jun 07, 2012 at 06:31 AM 0

Share

????!! thats the matter of the HTML5 playback, that the player works on a non-flash-browser.

The demonstration at longtailvideo.com/players/ work in this browser WITHOUT FLASH !

Answer 8 · 2012-06-07T12:32:57Z

Answer by Nicolas Vanhaute · Jun 07, 2012 at 12:32 PM

I got it working on my side

your jwplayer code is ok

for me it was just a problem with h264 profile used, so I put baseline 3.0

Nicolas

0 Show 1 · Share

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

river jack · Jun 07, 2012 at 03:49 AM 0

Share

Hi, I set up now the sample.mp4 vod stream. Please take a look:

http://eyb.de/stream/stream-vod-sample.html

on my windows maschine its working great (as all of the tests), but on a linux browser without flash the page is empty. But the demonstration at longtailvideo.com/players/ work in this browser.

Answer 9 · 2012-06-05T21:05:53Z

Answer by Richard Lanham · Jun 05, 2012 at 09:05 PM

'file': 'sintel.mp4',

Richard

0 Show 1 · Share

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

river jack · Jun 05, 2012 at 01:18 PM 0

Share

sorry, I couldnt find sintel.mp4 , even with grep in the server directory. maybe you have to clear the browser cache?!

Answer 10 · 2012-06-05T20:52:56Z

Answer by Richard Lanham · Jun 05, 2012 at 08:52 PM

Again, you are missing the file, or perhaps there is something wrong with it. You keep asking what is wrong with code and configuration, but it is simply that the file sintel.mp4 is not there, as I have demonstrated; your Wowza application is working and able to playback the Wowza sample.mp4 file that is in the content folder where your file needs to be.

Richard

0 Show 1 · Share

10 |600 characters needed characters left characters exceeded

Attachments: Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

river jack · Jun 05, 2012 at 01:01 PM 0

Share

:-(

What file? I dont need that file. I want to play the livestream, not a file.

In the current html files (stream-html5wowzaexample.html and -vod.html ) there`s also no sintel.mp4

only sintel.jpg but this is because of copy&paste the example code, it has nothing to do with my intention.

wowza stream to JW player HTML5

20 Replies

Your answer

Follow this Question

Related Questions

Hot Topics

Product Sign-in

Under the Hood

Partners

Company

Stay Connected

Sign Up for Our Blog

Select a Language