Software Archive
Read-only legacy content
17060 Discussions

AJAX ok in test but not emulate/build

Alan_B_
Beginner
1,478 Views

Hi - hope you'll bear with me as a rank amateur, but I've developed an app in HTML5/Javascript that accesses a mysql database via a php AJAX call. What puzzles me is that it works perfectly in a browser and in XDK emulate mode, but when I run in test mode or build, the php call does not work. An alternative call using plain HTML <form action="http://xxxxx method = "GET">  (ie not AJAX) works perfectly in test and build so the device I'm using (samsung S3 running Android 4.3) would appear not to be the issue. Any pointers much appreciated. Thanks Alan.

 

 

 

 

 

0 Kudos
23 Replies
Alan_B_
Beginner
1,268 Views

Just to say I've seen similar on another forum with solution which is to add script tag <script src="xhr.js"></script> to index.html. It worked!

0 Kudos
PaulF_IntelCorp
Employee
1,268 Views

Yes, that's the solution. It eliminates the CORS issue you're running into.

0 Kudos
David_S_1
Beginner
1,268 Views

@Alan B., Where is the script tag linking to --  a cdn, or did you put a copy into in your project? Is it the same xhr.js as this? I'm asking because it's not working for me in tests/builds, only in emulation (as you describe).

0 Kudos
PaulF_IntelCorp
Employee
1,268 Views

There is no xhr.js file in your project, it is "auto-magically" added by the emulator when you run there and by the build system when your app is built. This is also true of the intelxdk.js and cordova.js files. 

Note that you also need to include intelxdk.js in your app, first (before the xhr.js include). The emulator makes the bold assumption that you are going to use the intel.xdk namespace and automatically includes it even if you don't. The real build does not make this assumption.

0 Kudos
Alan_B_
Beginner
1,268 Views

David

I put it in the <head> section of index.html, just before the script 'intelxdk.js' which appeared automatically when using the new project wizard. Alan

0 Kudos
Alan_B_
Beginner
1,268 Views

David - as Paul said, I didn't need to actually have the xhr.js, just put the tag in as above. So I don't know if it was the same version as yours - you don't need to know!

0 Kudos
Lucas_Matias_G_
Beginner
1,268 Views

I have the same problem and tried to add the script <script src="xhr.js"> </ script> but I did not solve the problem. Is there any other solution? 
Thank you ...

0 Kudos
Junior_C_
Beginner
1,268 Views

Hello, same issue working with Cordova 3.5 and App Framework 2.1.
Its run over emulator but doesnt on device. The xhr.js was automatically added into page.

0 Kudos
Hamilton_Tenório_da_
Valued Contributor I
1,268 Views

I have a similar problem: the command getRemoteData does not work on tablets, but run OK on smartphone. I made a lot of tests today and I think that the problem is with Cordova 3.5 or 3.5.1.

When I build with these options (3.5 ou 3.5.1), the APP does not work on tablets. 

When I build with version 3.3, the APP runs OK (tablets and smartphones).

I don´t know why these differences (tablets or smartphones). My tests are made on:
Samsung S4 android 4.4.2
Samsung Tab 10.1 I android 4.0.4
Motorola Xoom android 4.1.2

Maybe something about Android version.

0 Kudos
PaulF_IntelCorp
Employee
1,268 Views

What happens when you build using Crosswalk?

0 Kudos
Hamilton_Tenório_da_
Valued Contributor I
1,268 Views

I´m not using Crosswalk yet. These situation is on Cordova 3.x Hybrid Android.

I did a lot of tests. If I do not insert XDK Device option, it does not run on any device. If I mark XDK Device, it runs on Samsung S4 (Android 4.4.2) but not on tablets. No error is displayed, just not run. No action ocurrs on server too. 

0 Kudos
Hamilton_Tenório_da_
Valued Contributor I
1,268 Views

One more information: if I use Cordova 3.3 to build, the APK works fine on all devices. Using 3.5 or 3.5.1 occurs these problems. The big problem is that Google is advising about Cordova 3.3 and the APK can be removed from Google Play. I need these solution. Thank you.

0 Kudos
PaulF_IntelCorp
Employee
1,268 Views

If you are using App Framework (either directly or because you selected App Framework when you created an App Designer project), there was a bug introduced into version 2.1 of App Framework. This bug was fixed last week. That bug interferes with receiving some Ajax notifications. You can get the most recent versions of the App Framework files from here: https://github.com/01org/appframework/tree/master/build

If you are using App Designer you can safely replace the App Framework files that App Designer inserted into your app with those you download from the repo. App Designer will not write over them, it will respect the updates you make to those files (I recommend you use the same names that App Designer uses for those files).

0 Kudos
Hamilton_Tenório_da_
Valued Contributor I
1,268 Views

Paul,

I changed the appframework.min.js for the new one and the problem is the same. On Samsung S4 runs OK, on Motorola Xoom, no action. No command is sent to server.

I used too then new version of appframework.ui.min.js (v2.1.0 of 2014-11-06) and occurs a new problem: the screen stay black on the left side (almost half). See the image 1. Returning the last one, the screen is OK. See image 2. It occurs on Emulate as on devices.

But it occurs only in large screens device Appel iPad on emulator or Mororola Xoom on device. If I change to a small screen this black part is not present.

 

0 Kudos
PaulF_IntelCorp
Employee
1,268 Views

Use the following URL in your browser to preview a kitchen sink App Framework app:

http://htmlpreview.github.io/?https://github.com/krisrak/html5-kitchensink-cordova-xdk-af/master/index.html

Once the page is loaded:

  • choose "App Framework UI" from the top menu (second item) or by selecting the AF UI tab at the very bottom
  • find "Side Menu Controls" in the list of Demos
  • push the "Toggle Side Menu" button

Do you see a side menu that works or do you see black?

Sorry, I don't have a version of that app that is put into project format that could be built, but it shouldn't be too hard to do. It is a modification of the App Framework kitchen sink app from the AF github repo. This modification was created by a colleague of mine. He's not in today, so I'm not able to get from him a project that you could put directly into the XDK and build for comparison.

This kitchen sink app should help you see what works and what does not. Note that you need to convert it into a project and perform a build to get a full comparison, because the procedure I outlined above shows the result inside of your device browser, which will be different than the results you get inside of a webview.

0 Kudos
PaulF_IntelCorp
Employee
1,268 Views

Hamilton, I was able to talk to my colleague and he turned that kitchen sink app into a project which you can download and use in the XDK. You'll find the project here: https://github.com/krisrak/html5-kitchensink-cordova-xdk-af 

You can try both, the web version and the webview version to see if you get the problem results you describe. This should help to narrow down the source of the problem.

0 Kudos
Hamilton_Tenório_da_
Valued Contributor I
1,268 Views

Paul,

After your comments I tried to find some menu. I found that:

<div id="menu" class="tabletMenu" style="overflow: hidden;"><div id="menu_scroller" style="-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);"></div><div class="afScrollbar" style="position: absolute; width: 5px; height: 20px; border-top-left-radius: 2px; border-top-right-radius: 2px; border-bottom-right-radius: 2px; border-bottom-left-radius: 2px; display: none; background-color: black; top: 0px; -webkit-transition: 0ms; transition: 0ms; background-position: initial initial; background-repeat: initial initial;"></div></div>

I didn´t see it before. There is a new DIV named tabletMenu?

I did not found a command to hide it. Even in the sink demo page this is not presente.

Then, I put in my code:

$('.tabletMenu').css("visibility", "hidden");

I don´t know if it the best solution, but it works.

Now I´m trying to find the problem with the original issue: the getRemoteData do not work in some devices and emulator.

0 Kudos
Hamilton_Tenório_da_
Valued Contributor I
1,268 Views

I´m returning to talk about the issue of getRemoteData. I did a lot of tests in my app and the situation is the same: the command getRemoteData works on Samsung Galaxy S4 but does not work on some tablets (Motorola Xoom and Samagung Tab 1).

Then, to isolate the problem and possible programming errors, I did other tests:

- I started a new project using the demo "A sample app showcasing how to use the intel.xdk library (JavaScript bridge library) for hybrid apps."

- I included a new buttom :         <a class="button widget uib_w_7 d-margins" data-uib="app_framework/button" data-ver="0" onclick="funVai()">GetRemoteData</a><span class="uib_shim"></span>

- I created a simple function that is fired onclick (and 2 others functions to be the result of this command):

function funVai() {
    alert('a');
intel.xdk.device.getRemoteData("http://www.xxxxxxxxxxxx.br/Capp_Xapp_convidados.asp","POST","e=132&c=abcdef&s=demoBASICA","funAchouEvento","funNaoAcessouSite");
}

- And I builded as Cordova 3.X Android

The issue is the same:

  • it works on emulator (no errors on console)
  • it works on Samsung Galaxy S4 Android 4.4.2
  • it does not work on Samsung Tab 10.1 I Android 4.0.4
  • it does not work on Motorola Xoom Android 4.1.2

Then I build again as Legacy Hybrid. In this compilation, it works OK on all devices.

What is wrong? How can I solve this? Is there another option?

0 Kudos
PaulF_IntelCorp
Employee
1,268 Views

There is a significant difference between the webview in Android 4.4 and <4.4, this is likely the source of the problem. The function was rewritten in order to make it available in a Cordova plugin format, so the code being run in the Cordova build is different than that being run in the legacy build.

I will report a bug, but cannot promise when or if this will be fixed in a reasonable time, since we are trying to encourage use of the public Cordova APIs. As a workaround, I suspect this will work in a Crosswalk build, since that is what the Crosswalk build provides, a well performing webview that is up-to-date. Try this in a Crosswalk build and let me know if it works across all devices.

0 Kudos
Hamilton_Tenório_da_
Valued Contributor I
1,087 Views

I build the APP using the legacy option. In this situation, the getRemoteData works well. The problem is that Google Developer Play shows a warning message about the version Cordova (3.3). 

0 Kudos
Reply