wowza, jwplayer, ipad html5 argghhh

[system]

Need some further help with this one. For some reason I cannot get the jwplayer to work via html5 using mp4 files.

I built a demo page to show the problem:

this page contains 3 videos, all are the same file.

video #1 has the mp4 hosted on the wowza server

video #2 has the mp4 hosted on my web server

video #3 has the video hosted on my web server, but instead of jw is only using the html5 video attribute

video #1 will NOT play in html5 mode even in safari much less ipad/iphone

video #1 is following the jw suggested code standards, and according to them it ‘should’ work, but it doesn’t. I’m seriously hoping there is someone here on these forums that either uses jw and can spot my error, or maybe someone who knows why wowza wont work.

link:

http://live.wptumble.com/jw1.html

I’m seriously at my wits end with this. I have tried every player on the market and still cannot find a solution to get my videos to play on all devices including the ipad/iphone.

I know my encoding is proper because in pure html5 video mode, #3, the video plays just fine, so it is either jw or wowza, or somehow I’m doing something wrong…

I had Andrew setup my server, so I doubt that is the issue as he is one of the experts here.

please help save my sanity

[shawn_gaffney]

Here is yet another demo where Wowza is not working in html5 mode.

this demo I setup using video.js with the flowplayer

video #1 is hosted on my web server

this video works perfectly

video #2 is hosted on the wowza server

once again, video when on wowza does not work

http://live.wptumble.com/flow1.html

I can add many more player examples in here such as the Kaltura player if needed, but I think I have now shown that it is a problem with wowza and not the players.

What in the world am I doing wrong?

[shawn_gaffney]

thnx for resonding.

in my first post there are 3 players.

player #1 is trying to pull the mp4 video from my wowza server, does not work

player #2 is trying to pull the same mp4 video but instead of wowza I put it on my web server, that works

player #3 is just an mp4 html5 video tag player to make sure that my mp4 works in safari

In my second post:

player #1 is an mp4 hosted on my web server, this player works

player #2 is the same mp4 hosted on the wowza server, it does not work

player #3 is just the same mp4 hosted on the web server but instead of using video.js it is straight html5 video tag.

The problem comes into play when I set the video = http://69.46.37.66:1935/jerrygaffneyministries/mp4:06-26-2011-short.mp4/playlist.m3u8

I did so many players and test pages in order to try and track down what the problem really is.

steps

1. make sure my mp4 is encoded correctly

by placing the mp4 video on the web server and calling it within just an html5 video enclosure I can find out if the encoding is right. This does work #3 video on both pages works in safari.

2. make sure that the player scripts are actually working

I ran 2 separate tests, one with jwplayer html5 fallback and the second is using video.js html5 player with fallback. I keep the mp4 video on the webserver from step #1

This tests returns correct as on jw1.html the second video works just fine in safari, and video #1 on flow1.html also works on safari.

3. Now lets test videos from wowza

I add the video to the wowza server and if I use jw1.html player using firefox the player then reverts back to a flash player and it works. This tells me that the video is placed in the proper place on wowza. Everything works as expected

4. now lets test the same video on wowza, but instead of a flash player, lets go to html5

All I have to do is open the pages up in safari so that html5 kicks in. This is where the problem comes into play.

Jwplayer will not accept the file http://69.46.37.66:1935/jerrygaffneyministries/mp4:06-26-2011-short.mp4/playlist.m3u8 for use within html5 fallback

video.js will not accept the file http://69.46.37.66:1935/jerrygaffneyministries/mp4:06-26-2011-short.mp4/playlist.m3u8 for use within html5 fallback

straight up html5 video will not accept the file http://69.46.37.66:1935/jerrygaffneyministries/mp4:06-26-2011-short.mp4/playlist.m3u8

This tells me that something is wrong with that link, where wowza uses a playlist for serving up the html5 .mp4 video

*I do not expect the html5 to work in firefox as mp4 is not supported, hence the fallback to the flash player.

that is why I use safari, because it does support mp4.

I hope this is more clear now. I know that the problem has been nailed down to the playlist problem. I do know that Richard originally setup the server with wowza for me a few years ago. I do know that I paid Andrew to do the last upgrade, and thought it was all working right. I do know that nothing has changed on the server since his last update. I just don’t know why this does not work.

**This is a dedicated colo box, where I do have root access to everything, though I have no idea what to do with anything in there, so I never even try. not a linux guy.

I don’t know how to further troubleshoot the problems, but I believe I have the issue pretty well nailed down now. Just dont know the fix

thnx

[shawn_gaffney]

This works

<video width="320" height="240" controls>
	<source src="http://live.wptumble.com/files/2011/07/06-26-2011-short.mp4"  type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
</video>

this does not work:

<video width="320" height="240" controls>
	<source src="http://69.46.37.66:1935/jerrygaffneyministries/mp4:06-26-2011-short.mp4/playlist.m3u8"  type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
</video>

The only difference is the first one simply references an mp4 file on my web server and the second one references the mp4 on my wowza server.

I suppose that is the most basic that i can make it.

[shawn_gaffney]

Yes, that is how it is setup. In fact it works when using the player in flash mode, it is only the playlist part that does not work.

If you try the page http://live.wptumble.com/jw1.html in firefox you will notice that the first video plays. That is because it is mp4 and using the flash mode. If you open in Safari, it does not play, that is because it is using the playlist html5 mode.

[shawn_gaffney]

None of your top examples work for me.

This works:

		<div id="video3"></div>

			<script type="text/javascript">
				jwplayer("video3").setup({
					file: '06-26-2011-short.mp4',
					id: '1812',
					width: '570px',
					image: 'http://live.wptumble.com/files/2011/06/kitten82.jpg',
					skin: "http://content.longtailvideo.com/skins/glow/glow.zip",
					'provider':'rtmp',
					'streamer':'rtmp://69.46.37.66:1935/jerrygaffneyministries',
					'modes': [
						{
							type:'flash',
							src:'http://live.wptumble.com/wp-content/themes/fluid-canvas4/includes/jw/player.swf'
						}
					]
				});
			</script>

Notice it is using flash only, which of course will not work on the ipad.

This does not work:

		<div id="video3"></div>

			<script type="text/javascript">
				jwplayer("video3").setup({
					file: '06-26-2011-short.mp4',
					id: '1812',
					width: '570px',
					image: 'http://live.wptumble.com/files/2011/06/kitten82.jpg',
					skin: "http://content.longtailvideo.com/skins/glow/glow.zip",
					'provider':'rtmp',
					'streamer':'rtmp://69.46.37.66:1935/jerrygaffneyministries',
					'modes': [
						{
							type:'html5',
							config:{
								'file':'http://69.46.37.66:1935/jerrygaffneyministries/mp4:06-26-2011-short.mp4/playlist.m3u8',
								'provider':'video',
								'id':'1812-html5',
								'x-webkit-airplay': 'allow'
								}
						}
					]
				});
			</script>

Notice that is the html5 mode with the playlist.

Anytime I use the playlist for wowza, then it pukes and does not work.

[shawn_gaffney]

Just wanted to drop a quick note to say that I got it figured out. For anyone else interested, you should really take a look at the flowplayer. It is a piece of cake to work with as they came up with some special js for the ipad with rtmp.

http://flowplayer.org/forum/4/66088

demo:

http://flowplayer.blacktrash.org/test/bethel.html

I’ve literally tried every player on the market, and this is the first combination that I could find that just plain works across all browsers including ipad for rtmp.

hope it helps someone else out in the future.

[Randall_Auriemma]

Hi annointed,

In your first post up there, did you get the #'s of your videos correct? You didn’t mention video #2.

FYI, I went to your first link, http://live.wptumble.com/jw1.html, there’s three videos. I’m using Firefox 3.6 on Kubuntu. The first video played fine. The second video played a minute or two after I clicked play. 3rd video just has an X.

On your second link, the first video played, the second one gave a file not found error. 3rd video is an X.

It shouldn’t matter where you’re putting the videos, as long as the location is set in the StorageDir property in your Application.xml. If the video is not at the proper location you’ll get a WARN in the Wowza console like this:

WARN server comment sample.mp4 MediaReaderH264.open[1]: java.io.FileNotFoundException: /usr/local/WowzaMediaServer/content1/sample.mp4 (No such file or directory)

[Randall_Auriemma]

Take a look at the VOD Tutorial.

For your link to work you would need a Wowza application called “jerrygaffneyministries” and the file “06-26-2011-short.mp4” would need to be in the [Wowza]/content directory. Is that how you have it set up?

[Randall_Auriemma]

Hi anointed,

So, you’re saying this works in flash: rtmp://[wowza-address]/jerrygaffneyministries/definst/mp4:myvideos/6-26-2011-short.mp4

Right?

Then this should work from the VOD Tutorial:

Enter the following URL into the Safari web browser on the device:

http://[wowza-address]:1935/vod/mp4:sample.mp4/playlist.m3u8

So for you it would be:

http://[wowza-address]:1935/jerrygaffneyministries/mp4:06-26-2011-short.mp4/playlist.m3u8

Does that work?

If it does, then maybe you have your codecs wrong in the HTML5 tag.

[Randall_Auriemma]

Oh, sorry. I made a mistake cutting and pasting from the VOD tutorial.

This:

rtmp://[wowza-address]/jerrygaffneyministries/_definst_/mp4:myvideos/6-26-2011-short.mp4

Should be:

rtmp://[wowza-address]/jerrygaffneyministries/mp4:6-26-2011-short.mp4

Try to follow the VOD Tutorial.

Do any of the links work?

Open up the OSMF player: [Wowza]/examples/SimpleVideoStreaming/clientOSMF/bin-release/SimpleOSMFPlayer.html

Its default line should work: http://localhost:1935/vod/mp4:sample.mp4/manifest.f4m

And so should this: rtmp://localhost:1935/vod/mp4:sample.mp4

Your issue is probably something simple. A typo or something. Start with the VOD Tutorial. Reinstall the latest Wowza if necessary.