My strange issue with Wikitude and Phonegap
After being approached by a client who wanted to make an AR App, I did some research online, and decided to work with PhoneGap, as I am comfortable with html, JS and CSS.
PhoneGap have two different systems that you can use - their CLI or the GUI ( Graphic User Interface / the Phonegap desktop app ). On the PhoneGap website, it says the following for their desktop app ....
PhoneGap Desktop is the simplest way to get started using PhoneGap. You use it to create apps, and serve those apps to connected mobile devices. It is the alternative to using the CLI, using the same libraries under the hood. So no need to memorize commands or install dependencies - those are all included when you download PhoneGap Desktop.
PhoneGap Desktop App - https://phonegap.com/products/#desktop-app-section
I decided to use this rather than the CLI. As well as the desktop app, I downloaded the Developer Mobile App, so that I could test the apps made with Phonegap on my mobile.
PhoneGap Developer Mobile App - https://phonegap.com/products/#mobile-app-section
When you open up the desktop app, you can quickly create an app using one of their available samples - one of which is a Wikitude AR sample. I created this, and then I could see the AR in action, with the Robot with the glowing eyes. (Info+Video - http://docs.phonegap.com/tutorials/develop/wikitude/ )
This worked perfectly, and then I was able to replace the existing Wikitude files for this demo, with ones from the samples that are available on Github. By simply replacing the files with those in the samples, I was able to make samples of the 3d models, image recognition, POIS, etc. Everything was working perfectly.
Then last Friday, when I opened up the Phonegap developer app on my mobile ( iPhone 6 ) - all of the wikitude AR pages no longer worked, and a popup appeared with the message "Loading AR web view failed: Frame load interrupted". This message appeared when I tried to open all of my sample pages whereas the day before, everything was working fine.
I had not made any changes to the code, had not updated or changed anything at all. I even opened the PhoneGap desktop app and created a 2nd version of the Wikitude AR Sample ( the robot one ) - but this time, it failed to work, and gave the same error message.
Today, I have got 3 people to download the PhoneGap desktop app and mobile app, and try to create the Wikitude sample. All three of them were able to do this, but when they opened the Wikitude sample, everyone saw the same error message. So I am pretty sure that I am not seeing this because of something I have done with the code.
Another thing that is different is that prior to Friday, the screen for the AR had the word "TRIAL" watermarked across it - and a small Wikitude logo in the bottom left. Now, the window is show the words "LICENSE KEY MISSING" rather than "TRIAL" and the Wikitude logo is larger, and also has the text "Powered by Wikitude" - which was not there previously.
In the PhoneGap desktop and mobile apps, all the other sample apps which are NOT AR/Wikitude related are all working perfectly as before. The only thing that is no longer working are the Wikitude/AR pages.
Has anyone else got this problem when using the PhoneGap desktop app and mobile app ?? I have not tried to use the PhoneGAP CLI, as I was initially having problems trying to install it all, so I do not know is the same problem exists with that. But ever since Friday, nothing related to the Wikitude AR samples/code has worked.
The other thing that makes it slightly difficult is that all of the Wikitude documentation for working with PhoneGap all relates to the CLI and not the GUI ( desktop app ) that I am using.
I am desperate to find a solution for this, as I was previously going through the samples and understanding how everything works, and now, I can't do anything.
Any help would be most welcome. Thanks for reading.
I had/have some similar problems.
First of all I liked to work with the desktop variation but switch to the CLI variation because only for CLI is an explanation available.
After different problems and with installing a lot of npm packages and Xcode for OS X I was able to create the project structure.
The robot sample never worked for me an error message like "index.html: Loading AR web view failed: Frame load interupted" appears every time.
I downloaded the Wikitude examples from Github and could initialize it with the "sh CreateSampleApp.sh ...." command. I entered a license key which I received as I downloaded the Cordova Wikitude Plugin (https://www.wikitude.com/products/extensions/cordova-plugin-augmented-reality/).
Wenn I choose one example/template option in the PhoneGap Developer Mobile App, a screen appears with a lot of "licence key missing" (as shown in the picture of Alex), but no error message.
I never was able to test the AR function. I never came that far, that at least the function is working with a trial watermark...
I do have iOS 11 and Xcode 9. At the end I would like to develop for iOS and Android. But for the beginning I am happy if it just works for iOS. Thanks a lot for the video explanation. I could create the sample project as you did. But there is an error message (see file attached).
The Url which is described as missing is there I can see it in my Finder.
Maybe it's because the world url is empty? What do I have to enter there?? The server address from the PhoneGap Dekstop App?
Thanks for your help.
I don't understand why you get this error plus the license error in the background. Did you just run the scripts as I did in the video or did you do some other steps?
Which version of Cordova and Cordova iOS are you using? Could you maybe post the Wikitude example app creation script output here?
Thanks for the additional information. I spent the past few days with a friend of mine who is very technical and we managed to get the samples app working on Android. After many hours of going through the instructions in your documentation, we couldn't get anything working when we tried and view our app through the Phonegap mobile app. From what my friend told me, there seems to be an issue between the Wikitude plugin and the Phonegap app, which is stopping the AR/Wikitude files and pages from working, but letting non AR pages work fine.
We took the sample files we had made, and then created a new project with the Android studio. From there, we created an APK file which we then sent to an Android device. When we opened it - everything was working fine and we could see all of the samples working.
I will be seeing my friend again later today, so I will try and find out more details about what he said about their seeming to be a compatibility issues between the plugin and phonegap. I'll update this post again later on when I know more information.
For now, the samples and the plugin are working, but not via the Phonegap mobile app.
Andreas, if you have a spare 5 minutes can you try the following ....
Download the Phonegap desktop app - https://phonegap.com/products/#desktop-app-section
Download the Phonegap developer app - https://phonegap.com/products/#mobile-app-section
Through the desktop create - create the Wikitude Augmented Reality sample which is one of the 5 available templates. Once its been created it, via it on the developer app on your phone. You should then see this error message that Peter and I kept on getting.
I did as you did in the video. No less or further steps...
I am using cordova 6.5.0 and in terminal I can see there is an update to 7.1.0 available.
Cordova ios is already 7.1.0 installed.
I can't add the whole files. The attachment is to big. Any certain files which will help?
-> I updated cordova to 7.1.0 and made a new project according to your video. But I receive the same error message again... (I attached the terminal commands I used).
That sounds like very good news!
The app has now been updated and finally, the Wikitude AR plugin is now working again !!
Hi again Andreas
Just wondering if you have any update on this ?? Have PhoneGap been made aware of this issue ?? Do you know if/when they plan to resolve it ??
When I'm using the CLI, I'm not using the Desktop App at all. I only do what is shown in the video.
The log is not stored as a file but shown in the Xcode Console when running the app. I assume that you launch your application through Xcode?!
I only see the alert when using the PhoneGap Desktop App, not the CLI (as shown in the video posted earlier).
You mentioned previously that it stopped working suddenly and with that, also the watermark changed. Could it be that a PhoneGap Mobile App update was installed on the device?
Now PhoneGap is working (I use the trial key) but when I build the apk & do the actual installation I get the exact same message (background is ok now - displaying TRIAL).
The only difference is that now it looks in my apps path instead of com.adobe.phonegap.app
Do you mean that when you use the PhoneGAP CLI instead of their desktop app, you can properly see your app working in the PhoneGap Mobile App ??