BitmapCake!

I've been recently working on an experimental project which involves augmented reality. If you have played a game like Pokemon Go, you probably already know what's augmented reality, and I'm not here to talk about it. I was trying to embed an augmented reality experience into one of our existing apps written as a Hybrid mobile app with Cordova / Phonegap. Therefore I used Wikitude to experiment, as it already has a Cordova plugin. Wikitude offers many plugins for various platforms and it's really easy to integrate as well. But it's not free.

Wikitude offers an unlimited trial account with all it's features, but with a watermark on the viewfinder (or the camera view). You can use the trial account while you develop and once you are satisfied, you can buy the SDK. But it costs a lot ;) It wasn't a problem to me as I was experimenting and trying on various solutions to integrate into our app. You will get a trial license key when you register with Wikitude to download their SDK. You can then use that key inside your app to validate your purchase.

One of the first problems I had using Wikitude was that even though I entered the license key, it kept showing me a huge watermark across the camera saying "License key is missing". Wikitude will not work until you enter a valid license key. So my first task was to solve this issue because without it, I wasn't able to do anything. At first I was a little frustrated because I did exactly as they have explained in their documentation and still it kept me saying the License key was missing. Then my first guess was my trial key may be invalid. But luckily, They had no option to renew it in their website. So I knew it wasn't the case. Then I kept digging a little more and found out the issue.

Here is the cause of error:
Even though you enter the license key into the WikitudePlugin.js located in ~/<your-app>/plugins/com.wikitude.phonegap.WikitudePlugin/www/ folder, the license key is not copied over to the plugin file after the build. What that means is,check the following location:

~/<your-app>/platforms/android/platform_www/plugins/com.wikitude.phonegap.WikitudePlugin/www/WikitudePlugin.js

You have another WikitudePlugin.js file in the above location. You have to open this file and enter your license key again here as well. Remember not to replace this with the WikitudePlugin.js file in your plugins folder as it will not fix this. It will only make your app to stop working. So just open this Javascript file and paste your license key into the same place.

That will fix your problem by identifying your license key and remove the huge watermark covering your camera view.

I hope this post will be helpful to someone. So please don't forget to leave a comment and tell me if this helped you :) If you think this post will be useful to your friends, be kind to share with them on Facebook, Twitter and Google+.