wowza stream to JW player HTML5

Wowza Streaming Engine
1

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!

2

You have the player setup for progressive download. Take a look at this guide to setup for rtmp connection with “streamer” param.

https://www.wowza.com/docs/how-to-use-longtail-jw-player-5-with-wowza-media-server

Richard

3

Actually, I’m wrong, what you had before was okay. It was missing script tag

<script type='text/javascript' src='/jwplayer/jwplayer.js'></script>

Make sure the src is pointing to correct location of jwplayer.js file.

Here is the longtailvideo guide for this:

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

Richard

4

This means it failed over to that. Test the RTMP connnection and stream name with the Wowza SimpleVideoStreaming player

[install-dir]/examples/SimpleVideoStreaming/client/simplevideostreaming.html

Server: rtmp://xx:1935/live/lq

Stream: mp4:sintel.mp4

You can run Wowza in stand-alone (/bin/startup.bat) mode instead of as a service so you can see log output in the console, which is helpful to debug.

Richard

5

I see the problem, sorry I missed it yesterday: The application is named “live” and the message indicates its StreamType is “live”, but you are playing a file. Change the StreamType to “default”

Richard

6

I am talking about the StreamType in the Wowza Application.xml. You are doing video on demand (vod) streaming, not live, so follow this guide:

https://www.wowza.com/docs/how-to-set-up-video-on-demand-streaming

Richard

7

What you are showing us is playing a file: sintel.mp4, which is vod (video on demand) streaming. Please follow this guide for video on demand streaming:

https://www.wowza.com/docs/how-to-set-up-video-on-demand-streaming

For Wirecast follow this guide for live streaming with RTMP encoder (which is what already have setup in the application named “live”):

https://www.wowza.com/docs/how-to-set-up-live-streaming-using-an-rtmp-based-encoder

Richard

8

Follow the vod tutorial to play file. Create a new app named “vod” with StreamType “default”, then change streamer, the RTMP url to point to that application

'streamer': 'rtmp://xx:1935/vod'

Richard

9

The latest html is completely messed up. You had it right at first. And it is working correctly, it is failing over to download, because it is not an iOS device and the file sintel.mp4 is not found. The stream failed. I have tested this. Go back to the way you had the html in the very first post, that was correct.

The only problem is that sintel.mp4 does not exist in /conf/vod/Application.xml /StorageDir, which by default is [wowza-install-dir]/content. You will see a file named “sample.mp4” in that location, which plays from your server using the SimpleVideoStreaming example plyayer:

Server: rtmp://stream1.eyb.de:1935/vod

Stream: mp4:sample.mp4

Again, there is nothing wrong with the original html, the problem is the file is missing. You should test with Simple player first.

Richard

10

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

11

‘file’: ‘sintel.mp4’,

Richard

12

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

Richard

13

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

Richard

14

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

15

You can do something like this:

<html>
<body>
<video x-webkit-airplay="allow"
controls width="640" height="360"
src="http://[wowza-address]:1935/vod/mp4:sample.mp4/playlist.m3u8"
autoplay="autoplay" muted="muted"/>
</body>
</html>

Or like this:

<html>
<body>
<video controls src="http://[wowza-address]:1935/vod/sample.mp4/playlist.m3u8"></video>
</body>
</html>

Richard

16

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

17

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:

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

18

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’

19

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.

20

Hi multibc,

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