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.
Related
I have a Cordova application that makes HTTP calls to an IoT device and grabs some data from it (eg. http://192.168.1.1/file.xml).
The calls are made via XMLHttpRequest.
When updating Cordova from 10 to 11 the calls stopped working on the Android device/webview.
When analyzing via chrome::inspect following error message appeared in the console:
Mixed Content: The page at 'https://localhost/index.html' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://192.168.1.1/file.xml'. This request has been blocked; the content must be served over HTTPS.
OK, I've found this:
https://forum.ionicframework.com/t/allowing-mixed-content-on-android-cordova-app/208943
Adding this line to my config.xml helped:
<preference name="Scheme" value="http" />
But now, there is another error:
Access to XMLHttpRequest at 'http://192.168.1.1/file.xml' from origin 'http://localhost' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Any idea?
Since I could not find a solution for this, I've compared the Java sources and found it myself.
Another preference needs to be entered into config.xml in this case:
<preference name="AndroidInsecureFileModeEnabled" value="true" />
This is needed because of the code changes in (cordova project directory)\platforms\android\CordovaLib\src\org\apache\cordova\ConfigXmlParser.java, class of the same name, method setStartUrl. The preference enforces old behavior.
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.
I have a phonegap webapp running on BackboneJS. It fetches JSON from a backend running in localhost:3000.
The collection fetches correctly in the browser and in iOS within the emulator. However android does not work!
my /platforms/android/AndroidManifest.xml file:
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
My config.xml file
<access origin="*" />
any idea why it does not work in Android?
When i inspect the response all i have is response.statusText saying "error"
Well after spending some time looking around i tried using a real IP address to fetch the JSON (I was using localhost:3000 before) and it now works.
It's quite weird that it was working on iOS and not on Android
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.
im testing this on nexus s with ics
phongap version 1.4
jqm version 1.0.1
i tried following these guidelines,
1) added Access-Control-Allow-Origin in server app running at local ip http://192.168.1.132/orderpage, tried with both html and json reponses
2) may be this not needed but still i've set $.support.cors and $.mobile.allowCrossDomainPages to true;
3) phonegap.xml origin is set to *
4) also put a super.setIntegerProperty("loadUrlTimeoutValue", 60000);
this works fine on browser but i keep getting error loading page on phonegap no matter what!
am i missing something in phonegap app? loading local file works fine $.mobile.loadPage('order.html') but
$.mobile.loadPage( "http://192.168.1.132/orderpage", { showLoadMsg: true } );
fails with error loading page
the app im trying to build is totally depended on server side content, how can i safely load external content with ajax calls or loadpage()
and how to debug to check if phonegap is even making the request to network?
any suggestion is greatly appreciated.
thank you,
I found I need to add <uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
To my AndroidManifest.xml
HTH