Cross-domain requests using PhoneGap and jQuery doesn't work

Question

I\'m creating a PhoneGap app for Android. To get data from the (remote) server I make a REST call using jQuery\'s $.ajax() function. There are a few things you must know:

Answer 1

Try setting dataType:jsonp and set crossDomain:true For cross domain ajax requests you can use jsonp. http://api.jquery.com/jQuery.ajax/

Or you can append callback=? to your url.

Answer 2

you need to whitelist your external domains. just go to your phonegap / cordova plist file in xcode and add a new entry, have it's value be * and you can access any website out there.

also know that this WILL NOT WORK IN A BROWSER. Browsers have crossdomain issues, not phonegap or mobile devices.

Answer 3

Adding this to the config.xml saved me

<gap:plugin name="com.indigoway.cordova.whitelist.whitelistplugin" version="1.1.1" />
<access origin="*" />
<allow-navigation href="*" />
<allow-intent href="*" />

I was baffled as to why any outside resource did not load, even google maps and my remote debugging tool. This saved me!

Answer 4

JQuery setting ：$.support.cors = true;

Answer 5

I solved the problem by myself. The problem is located in the url, where I have to add a domain. I changed

var url = "http://remote/server/rest/call";

to

var url = "http://remote.mydomain.com/server/rest/call";

and it works!

I assumed the first url should work because it works on an iphone app with exact the same url and settings. It has also something to do with a double firewall(Windows and ESET firewall) where I shut down the Windows firewall.

Anyway, thanks for your answers!