Start a new topic

Can't load video from server in VideoDrawable

Can't load video from server in VideoDrawable


I'm having currently an issue with the AR.VideoDrawable object when instantiating it with a link to my web server.

I'm developing on wikitude through xamarin on iOS (if it can help to understand the issue)

I'm using 

var videoOne = new AR.VideoDrawable("", 0.5, {
            offsetX: 0,
            offsetY: 0,
            onError: function oneErrorFn () {
                document.getElementById('loadingMessage').innerHTML = videoOne.getUri();

The video has been encoded in mp4 with a 1250 maximal bitrate and H.264 encoder as recommended. But the onError method is still called and video isn't played in the trackable2DObject.

I wondered if it was linked to dropbox and moved the video to my webserver and changed the url to a direct link to the video but it didn't helped.

I checked in my iphone webbrowser to use the link to the server and the video played correctly so it's not linked to any codecs.

Does anyone has an idea about why it's failing to load the video ?

Hi Bastien,

First of all, in order for the video to load there should be a direct url so it is good that you moved the video to your webserver and changed the url to a direct link to the video. Based on the link you provided for the video, it looks that the dimensions are too high and the file size as well. So these two issues may cause your problem. The best resolution for video drawables are 1280x720 pixels. This documentation may help you in terms of video drawables.

Finally, you should also keep in mind that if you are developing on iOS then you should not use https prefix but http instead. 


Thank you for you answer.

I tryed reducing the filesize and format of the video.

The video weight now less than 1Mo and is in 720p (1280x720)

I also replaced the dropbox link with the server direct link :

But no change, the issue persist (no https this time) and onError method is called.

Full code if it can help:

var videoOne = new AR.VideoDrawable("", 1, {
            offsetX: 0,
            offsetY: 0,
            onError: function oneErrorFn () {
                document.getElementById('scanning').innerHTML = videoOne.getUri();

Any clue about what I'm doing wrong ? Because I couldn't find anything in the documentation related to this issue.


From the code you sent I see you call the oneErrorfn function to load your video, so maybe this is why you cannot see the video. Could please check this documentation here and maybe try and use a different function like onEnterFieldOfVision as suggested in the documentation. If this does not fix your issue then could you please send your complete AR experience (.html, .css, .js files, assets, target images) so we can test internally?


According to documentation onEnterFieldOfVision is not a function available for a videoDrawable, it's for the Trackable2DObject which is declared after the instanciation of the videoDrawable.

Anyway I tryed to remove the onError function but issue persist.

I attached the whole AR experience in a zip file to this comment.

Hi Bastien,

I tested your AR experience you just send us and everything is working fine. I created my own index.html file, because you did not include yours in the folder you send me,  and the video is loaded as expected. Can you please try again and if the issue remains upload your whole AR experience folder in a server you are using so I can test there as well.



I tryed opening the WikitudeSDKSample in the Xamarin component and changing it to target my video but no luck, it's still not working.

The whole Xamarin project (which work also for visual studio obviously) and can be downloaded here:

Simple question: is the feature related to have the videos on an external server restricted to paid licenses keys ? Because i'm currently using a free one as our customer didn't bought the license yet.

Thank you for your help


I just auto answer my last question, the feature to stream the video from a webserver isn't related to the trial license.

Our customer provided us the paid license but still no luck, the streaming from the webserver isn't working.

The project can be still found on my server :

Could you please assist to understant what is the issue ?

Best regards

Hello Bastien,

The problem is in the imageontarget.js file that you are using. Please use as a guidance the file I am sending you.



In the end it looks like the issue comes from my iPhone, I tried with my iPad (the app is supposed to be only for iPhone so I didn't thought about testing on the tablet) and it's working perfectly.

Sorry for the troubles i caused.

Now I need to find what's wrong with my iPhone.

Sorry again for the inconvenience.


Just saw that this post had few visits in it so I might not be the only one to have faced this issue.

My issue was linked to iOS 9 security service which blocked the load of a content through http on an unknown server.

To have the video working I just added my server url in the NSAppTransportSecurity in info.plist file like here:

Best regards,

Login or Signup to post a comment