Wikitude / wikitude-cordova-plugin-samples

Includes augmented reality sample project for Phonegap (Android and iOS) using Wikitude's augmented reality Phonegap plugin
www.wikitude.com
76 stars 61 forks source link

AR/Camera not working for samples? #52

Open vicung opened 6 years ago

vicung commented 6 years ago

I'm looking into developing a Geo AR App and therefore want to try out wikitude's instant tracking and Geo AR functionalities. I have setup cordova, added the wikitude plugin, built several of the sample folders for android and ran them on my Samsung S8. The App launches on my phone but instead of the AR View I only see a white screen with the ADE "button" on the bottom right and some other UI elements. I have manually configured all permission settings for the app including camera permission. I have tried out different settings in ADE but it doesn't seem to make much of a difference The only errors I'm getting from the console are these, while the latter two appear when I touch anywhere on the white space on the screen:

architect.js:1 Failed to load resource: the server responded with a status of 404 (Not Found) ade.js:1 Uncaught TypeError: AR.js.click.executePlatformClick is not a function at Object.executeClick (ade.js:1) at HTMLDocument.touchendEvent (ade.js:1) ade.js:1 Uncaught TypeError: AR.js.click.executePlatformClick is not a function at Object.executeClick (ade.js:1) at HTMLDocument.touchendEvent (ade.js:1)

I have also tried the Unity Wikitude samples and with those the camera work perfectly fine, but because I'm interested in the sensor-based Geo AR, this is (at least currently) not an option. I have also found the other github sample repo here #https://github.com/Wikitude/wikitude-cordova-plugin-samples but the command line doesn't seem to work on Windows?!

How can I get the samples work properly with cordova?

AndreasSchacherbauerWikitude commented 6 years ago

Hi @vicung, Since you mentioned ADE I'm not sure if you execute the Architect World correctly. You need to use the Wikitude JS API SDK to load Architect Worlds. A standard web browser is not able to do this as it is missing our JS library (which is bundled and injected into the web view that our SDK is offering).

On desktop browser you have the ADE available but no camera running as the ADE is more of a debug tool but not supposed to enable Architect Worlds on desktop browser.

vicung commented 6 years ago

Thank you for your reply! I am now also in touch with the Wikitude support on the wikitude forums https://support.wikitude.com/support/discussions/topics/5000088480?page=1 and they provided these samples instead https://cdn.wikitude.com/sdk/8_0_0/WikitudeSDK_Android_8-0-0_2018-07-04_17-05-46.zip I have added the architect.js library with the following line in my index.html <script src="https://www.wikitude.com/libs/architect.js"></script> In fact I actually just copied all folders and files including the ade.js script from the sample folder that I wanted to test to my 'www' folder in my cordova project and only checked if all source file references were correct (i.e. I moved the ade.js file to my 'js' folder instead so I referenced it like this: '' Now we have pinpointed the problem to be the architect.js script not beeing loaded as I get the following error: Refused to load the script 'https://www.wikitude.com/libs/architect.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' 'unsafe-eval'". I'm trying to figure out what I have to change so it will be loaded.

And thank you for the clarification with the ADE, since it was the only UI where I could change some settings in the particular sample that I was testing then, I thought it might be relevant. Now I have tested more samples and see that there are more UI elements but unfortunately still no camera/AR view but only a white background :/

basurahan commented 5 years ago

Thank you for your reply! I am now also in touch with the Wikitude support on the wikitude forums https://support.wikitude.com/support/discussions/topics/5000088480?page=1 and they provided these samples instead https://cdn.wikitude.com/sdk/8_0_0/WikitudeSDK_Android_8-0-0_2018-07-04_17-05-46.zip I have added the architect.js library with the following line in my index.html <script src="https://www.wikitude.com/libs/architect.js"></script> In fact I actually just copied all folders and files including the ade.js script from the sample folder that I wanted to test to my 'www' folder in my cordova project and only checked if all source file references were correct (i.e. I moved the ade.js file to my 'js' folder instead so I referenced it like this: '' Now we have pinpointed the problem to be the architect.js script not beeing loaded as I get the following error: Refused to load the script 'https://www.wikitude.com/libs/architect.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' 'unsafe-eval'". I'm trying to figure out what I have to change so it will be loaded.

And thank you for the clarification with the ADE, since it was the only UI where I could change some settings in the particular sample that I was testing then, I thought it might be relevant. Now I have tested more samples and see that there are more UI elements but unfortunately still no camera/AR view but only a white background :/

i have the same problem are you able to solve this?

JenHa commented 5 years ago

I would be thankful for a solution, too