AJAX Call not working in Phonegap but working normally

Question

i am using the open weather map api webservice to make an ajax call inorder to get the current weather using the latitude and longitude the problem is the same call works in my normal php folder but it doesnt work in my phongap app. My ajax call is as shown below

$.ajax({
        type : "GET",
    dataType: "jsonp",
        url  : "http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139",
    }).done( function(msg){
     var response = JSON.stringify(msg);
     var parsedResponse = JSON.parse(response);
     alert(parsedResponse.main.temp_min);
    });
});

I have tried without dataType: "jsonp" tried changing it to "json" but nothing works at all. Please help me as I am stuck on this currently.

Solution 1

Have you whitelisted the url in your config.xml?

<access origin="http://api.openweathermap.org" />

Read more: http://docs.phonegap.com/en/3.0.0/guide_appdev_whitelist_index.md.html#Domain%20Whitelist%20Guide

Solution 2

For future searches

yourprojectpath/config.xml

Add or check the following lines

<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />

It may also be required to install "cordova-plugin-whitelist" plugin:

Cordova

cordova plugin add cordova-plugin-whitelist
cordova prepare

Phonegap

phonegap plugin add cordova-plugin-whitelist
phonegap prepare

Also make sure to add the necessary Content-Security-Policy in your file.html:

https://github.com/apache/cordova-plugin-whitelist#content-security-policy