Develop Reference

how to call external web services in phonegap application

I am new to phonegap. I want to call server side web service from phonegap application to get data. I have tried it on browser it working fine and also on Phonegap developer app for Android. Both are working fine. But if i make .APK from PhonegapBuild console and installed on android device, it doesn't work anymore.
I have used AJAX to call web service. I also tried other solutions related this but all are fail.
Solution 1:
Changed in config.xml
< access origin="*"/> with
< access origin="http://mywebserviceipaddress"/>
Solution 2: Changed AJAX call with .get() method. For this added image where i have added two methods for code.
Solution 3: Added
$.ajax({
...
crossDomain: true,
async: false,
cache : false,
...
});
in AJAX call
Here is my both code. Please tell me if missing any parameters.
enter image description here

JSON call to server from PhoneGap application - No response

I am building my first PhoneGap application, just a proof-of-concept at the moment.
What I want to do is to perform an Ajax call (using JSONP) to retrieve a record from a database on a backend server. The code is working perfectly in the browser, but when I make an Android .apk using PhoneGap Build, that call is not doing anything.
The pages opens, and local Javascript works. I can even use localStorage.
But it seems like the application is not allowing my to communicate out to the Internet.
In config.xml I have added
<access origin="*"/>
as well as
<config-file platform="android" parent="/manifest" mode="merge">
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
</config-file>
Here is the relevant jQuery code which does the call:
var json = new Object();
var docunid = $("#policyNumber").attr("data-docunid");
$("#statusInfo").html("Loading " + docunid + "...");
json["unid"] = docunid;
$.ajax({
url: "http://www.example.com/websites/losscontrol/ajax_GetInspectionDetails.jsonp",
dataType: "jsonp",
data: json
});
When the code is executed, the message "Loading xxxxxxxx..." is being displayed, then nothing. In the browser it all works, the data is retrieved and the values displayed by the callback function.
What am I missing?
Update:
Thanks to Simon's comment I managed to solve it. The network guys had blocked the web server from external access without me knowing it.
So when I executed the code in the browser on my computer inside the firewall, it worked, but when the same URL was called from the PhoneGap application on my phone (and therefor outside the firewall) it simply did not work.

If you haven't already done so, you need to install the Cordova whitelist plugin. This issue had me stumped for a while. There are other threads on here with the same problem.

PhoneGap Android Device Ready but no Ajax

I wonder if my problem is my ajax call is to http, not https. Must I call with https or can I call with http?
I am compiling with PhoneGap cloud cli-5.2.0 ( iOS 3.9.1 / Android 4.1.1 / Windows 3.8.1)
I compile my package, install it on my Android Samsung, it starts up, and my $.ajax errors
errorThrown:undefined
textStatus:error
data:{"readyState":4,"responseText":"","status":404,"statusText":"Not Found"}
Any suggestions/ideas?
I read the following:
jQuery Mobile + Phonegap on Android - no Ajax but its two years old and relates to an older version of phonegap.
My code requires no special magic - I do include phonegap.js but I do not use gps, camera, contacts etc etc
Using the code below, I do get my "deviceready" and "document ready" displayed. When I click on my login button (id='demologin') the function DemoLogin() is executed.
function onDeviceReady() {
$("#demologin").on("click", DemoLogin );
$("#demologin").after("<h3>deviceready</h3>");
return true;
}
$(document).ready(
function()
{
document.addEventListener("deviceready", onDeviceReady, false);
$("#demologin").after("<h3>document ready</h3>");
});
If I were to guess, the ajax "404" leads me to believe its calling a URL that does not exist hence why I wonder if Android expects me to call https instead of http. The problem I have with this is the code works on iOS so I would have thought PhoneGap magic would lead me to believe if it runs on one, it would run on the other.
All help appreciated!

I also use ajax on phonegap app and it work good. You can make call to http. I think the url you called does not exist or there may be connection problems like when data is switched off.

This is a old question but, possibly the solution will help someone who is googling it.
Add this code to your config.xml file:
<gap:plugin name="cordova-plugin-whitelist" source="npm" />
<access origin="*" />
because new release of Cordova need whitelist plugin.

Phonegap + backbone fetch, not working due to cross domain

I'm currently developping a phonegap app with backbone but i'm not able to fetch my data from a cross domain website.
Testing the app on android gives me no results but testing it in chrome with "chromium-browser --disable-web-security" gives me a success response with the data I need.
Using phonegap I added the following lines of code:
config.xml
<access origin=".*"/>
AndroidManifest.xml
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
json
[
{
"id":"918",
"merk":"Yamaha",
"type":"YZF R1"
...
Its a valid json file.
My backbone collectionName.fetch() doesn't work, and doing a simple ajax call isn't working either inside the app.
Is there any reason why I cannot fetch my data from the api in my phonegap android app!
I really could use some help
cheers!

From the file:// protocol there should be no limitations regarding same-origin, see here: http://en.wikipedia.org/wiki/Same_origin_policy#Corner_cases_and_exceptions
However it could be the server doesn't allow access to requests originating from file:// url's, check your server log. To doublecheck you could also access a publicly accessible webservice like Google Geocoding (see comment).
Edit: this is actually wrong...
This likely is because cross domain is only allowed within the same protocol. Since your phonegap app runs from file:// this introduces problems when connecting via http(s):// protocol.

AJAX Request from Phonegap Android fails

I have been working on this for the last two days, and looking at a lot of other suggestions. Yes I can get this simple ajax request to work from within a phonegap application, both on the android emulator and on an actual android phone.
My phonegap version is (using phonegap -v) 3.0.0-0.14.3
The code I'm using is:
var url = 'http://www.thomas-bayer.com/sqlrest/CUSTOMER';
return $.ajax({
type: "GET",
url: url,
timeout: 60 * 1000
}).done(function (data) {
alert('hey');
}).fail(function (a, b, c) {
console.log(b + '|' + c);
});
The result I'm getting in the log is just:
error| at file:///android_asset/www/js/index.js:62
I added the settings to the AndroidManifest.xml
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
and I have the following in Config.xml
<param name="android-package" value="org.apache.cordova.core.NetworkManager" />
When I check navigator.connection.type I get 3G on the emulator and wifi on the physical phone.
Any idea what else could go wrong?
UPDATE:
If I log the JSON in the first parameter of the failing function I get:
{"readyState":4,"status":404,"statusText":"error"}

You should whitelist the domain in order for your AJAX calls to work.
Add this line to config file -:
<access origin="*" />
Phonegap's default policy blocks all network access unless specified otherwise. The above line will disable this security restriction. You can also be more specific in allowing only certain domains to bypass this security feature by including the domain name in the config file like so
<access origin="http://yourdomain" />

additionally to the whitelisting, make sure the cors flag is true to enable cross origin resource sharing.
$.support.cors=true;
please find the reference here

I had a localhost url as I was using Visual Studio.
I resolved by editing the VS projects Applicationhost.config file and making a version of the binding protocol so that is it :port: not *:port:localhost, and then accessing via ip address.
Make sure to get all references to the port.