WebApp and Web Services: It is not working.

[massimo_r_]

Dear Guys,

I tried to build a webApp from my project, including some simple calls to a Web Service that I created. These calls populate some lists or some controls (I tried not just one)

The problem is that meanwhile it properly works in the xdk mobile emulation (and I tried even when installed in a Mobile), the Browser opens index.html but the web services calls do not work in a WebApp (even built on the building server, unpackaged and installed correctly).

What I am doing wrong? There is some specific template or framework that I must use to see in a WebApp my Services data?

I desperately need something that I can use in both ambients Mobile or Webapp in a Browser.

Thanks a lot for your helps.

[Swati_S_Intel1]

What build option are you using? If you are building as a WebApp, you will get a zip file of your project and you must upload all the files inside the zip on your website. And you can run it in any browser (mobile or not) pointing at your website.

If you want your app to run as a standalone app on a mobile device, you must build for specific platform, i.e. Android, iOS etc. When you build for these platforms you get platform specific binary (.apk, .ipa etc) which you can install on your device. When you build like this, you have to make sure you provide correct build options under the Project > Build Settings tab to allow the app to access web services. These settings are under "Access List" settings. Use Internal whitelist to access your domain from within your app. You can either put your domain name or put a * in the Access List input box.

[massimo_r_]

SWATI S. (Intel) wrote:

What build option are you using? If you are building as a WebApp, you will get a zip file of your project and you must upload all the files inside the zip on your website. And you can run it in any browser (mobile or not) pointing at your website........If you want your app to run as a standalone app on a mobile device, you must build for specific platform, i.e. Android, iOS etc. When you build for these platforms you get platform specific binary (.apk, .ipa etc) which you can install on your device. ...

Thanks for your reply and .. Look SWATI, I know very well how to use Services and integrate them in a Mobile APP with XDK..

The problem is ONLY the building as a WebApp. I get this ZIP but the same controls and services that I use correctly under Mobile can't work in the Browser.

[PaulF_IntelCorp]

Massimo, where/how are you hosting and running the app inside the ZIP that is generated?

[Swati_S_Intel1]

@Massimo, regarding controls and webservices, please tell us what exactly are you trying to do. What kind of webservices are you using? For the controls part, some of the mobile UI frameworks are not supported on regular browsers. For example jQuery Mobile is supported on most browsers barring a few whereas ionic is meant for mobile webviews only. So, depending on which UI framework you have used, your controls may or may not work. 

[massimo_r_]

Paul F. (Intel) wrote:

Massimo, where/how are you hosting and running the app inside the ZIP that is generated?

Hello Paul, thanks for your support.

Firstly: I extracted all and I  simply tried to open the index.html by a browser, directly from file system

Then I copied the whole structure of directories that I found inside the .ZIP, in a IIS site so I went to my local machine in that site. It opens me the page, I see some controls and buttons, lists.. BUT... those controls that are attached to a web service (and that work in the emulation mobile and inside an app) are not visibile inside the Browser. Concretly they are not loaded.. blank

I debugged a little the Javascript scripts. But I lost :)) and I could not find the point. I can't say if they cannot connect to web services or they can but they do not properly attach the datas to the controls.

I tried with IExplorer, Opera and Chrome. 

[massimo_r_]

SWATI S. (Intel) wrote:

@Massimo, regarding controls and webservices, please tell us what exactly are you trying to do. What kind of webservices are you using? For the controls part, some of the mobile UI frameworks are not supported on regular browsers. For example jQuery Mobile is supported on most browsers barring a few whereas ionic is meant for mobile webviews only. So, depending on which UI framework you have used, your controls may or may not work. 

I supposed I followed the suggestions that I see starting a new Project. But it's possible I tried a wrong path.

Now I try again and I trace it, so I can tell you more. Please, stay tuned!! ;)

[massimo_r_]

Ok SWATI & Paul,

I have a StandardHTML5 project, Ratchet Framework

I created Rest WebServices that I get available by SandBoxGet tool

I associated some simple datas {NAME,ADDRESS} to a RadioGroup; by the way, not everything is clear in this, I think some bug is present even here, but ok, let's overcome for now cause anyway I see something.

When I emulate I see the datas coming from my Service, then I build, upload Zip and I open index.html .. nothing.

what's wrong?

[massimo_r_]

I tried StandardHTML5 project and all Framework types and it is the same.

Maybe you can suggest me a combination that permits to show simple Web Services on mobile and over a WebApp? Or this is still not implemented in XDK via sandBoxGet Tool?

Thanks for your attention

Massimo

[Anjali_G_Intel]

Hi,

I recreated your steps and saw the same issue. I choose a webapp with Appframework and used chrome to launch from localhost. I had to make two changes to fix the issue.

1. Disabling AdBlock. This may or may not be applicable in your browser. Check the network tab in the debugger to make sure any requests to "index_setup_services.js"  or "index_init_services.js" are not failing. 

2. Using CORS. The REST API that I tested with was a temporary one from mocky.io and I didn't want to modify the server response so I just used a chrome extension to work around that . Once you have confirmed that, check to see if the server response you are getting has the right response headers, specially for "Access-Control-Allow-Origin". I have found this tutorial to be really helpful in the past.  

Let us know how it goes.