jwPlayer video not loading on iPad/iPhone

Question

The Context

We have a fully-working donation widget for nonprofits. We're experiencing one caveat: the video won't load on the last part when using an iPod or iPhone.

The Problem

I must warn you, friends. This is a hard one.

For some reason, when I embed a jwPlayer video, on either iPhone and iPad I receive the following message:

The video could not be loaded, either because the server or network failed or because the format is not supported: http://content.bitsontherun.com/jwp/2gQXJaVU.xml

Here are some key things to note:

• See demo at: http://www.socialgoodnetwork.com/betterbutton/demo/?id=tvymca_3 To get to the last slide, click "Give Now" and click "Submit" to get through the process. I put the same video in the first slide as the last.
• The last slide (after the donation) won't display the video. If I play the video at the first slide, it works fine.
• Happens on iPhone and iPad only

The jwPlayer.js player options:

{
    "plugins":              {
                            "gapro": {
                                 'accountid':        "UA-XXXXXXXX-1"
                                ,'trackstarts':      true
                                ,'trackpercentage':  true
                                ,'tracktime':        true
                                } 
                            },
    "gapro.accountid":      "UA-XXXXXXXX-1",
    "logo.hide":            "true",
    "logo":                 {hide: true},
    "file":                 params.url,
    "repeat":               "none",
    "autostart":            "true",
    "playlist.size":        "200",
    "image":                "http://content.bitsontherun.com/thumbs/aQ5bdlXV-640.jpg",
    "stretching":           "uniform",
    "height":               "375",
    "playlist.position":    "none",
    "width":                "560",
    "controlbar.position":  "bottom",
    "skin":                 "http://d1rhaz9gq9lm5b.cloudfront.net/2Bbp4Z6O.zip",
    "ping.pixel":           "http://content.bitsontherun.com/ping.gif",

    "playerready":          "jwplayer.api.playerReady",

    'autostart':            true,

    "flashplayer":          "http://www.socialgoodnetwork.com/jwplayer.swf?logo.hide=true&plugins=gapro-1&gapro.accountid=UA-XXXXXXXX-1",
    'modes':                [
                                {type: 'html5'},
                                {type: 'flash', src: '/jwplayer.swf?logo.hide=true'}
                            ]
}

I must say, anything you can do to help - thanks in advance!

Solution 1

For some reason, setting autostart to false made my videos work on iOS:

    'autostart': false,

I'll try to post more information later. It could be that my videos are not encoded properly.

Solution 2

You are providing Flash only vidoes. Non of the iDevices support Flash, this is a decision taken by Apple.

You need to also provide your video sources in MP4 format to be playable on iDevices.

This is pretty much what Justin McCraw said above/below.

Solution 3

In order to make the HTML5 version work for iOS and other non-Flash enabled devices, you have to have the actual files hosted somewhere on your own or a third-party server. That is, you need to display .MP4 videos to users with iOS devices. YouTube videos also work. Is your params.url file for Flash .swf file? You can read more about this requirement from LongTail's documentation. Hopefully, I understood the problem correctly.

Solution 4

I suppose there is a request for statistics. In my case the requested URL before and after playback from firebug looks like this:

http://i.n.jwpltx.com/v1/jwplayer6/ping.gif?tv=3867&ph=0&n=3242919060939303&aid=_&e=e&i=0&pv=6.6.3867&pu=http%3A%2F%2F[PAGE_URL]%2F&m=1&a=0&v=0&w=100%25&h=270&ed=0&pn=&pt=title

If proxy blocks that address an error is shown. After configuring proxy to accept this type of requests, jwplayer works ok.

Hope this will help somebody.

View more solutions

Comments

[Avatar]

This might also help: stackoverflow.com/a/24076523/1066234

[redolent]

UPDATE: We never quite figured it out. But we ended up using their API to start the video instead of this option.

[Elliot Coad]

For what it is worth, I've noticed that the JW Player API to start the video on iPhone and iPads seems to initialise the buffer (you can see the loading icon) but it never actual plays the video. If you pause the buffer and press play it will load correctly on the devices.

[Jack B Nimble]

@ElliotCoad Did you ever find a solution to this?

[redolent]

Try using the jwPlayer API, and try fiddling with the autostart option. If you need it to autostart, just call start from the API instead of specifying this option.

[Francesco]

onPlay seek with autostart doesn't work on iPad, it's go in buffering loop