PhoneGap - Jsonp Error 404 Not Found on call - angularjs

Question

Here is a commun error, but every solution give on Stack didn't solve my problem.
I have a phonegap app, my jsonp call send me a 404 error
Here is the function of the controller (angularjs) :
$scope.pullContent = function() {
$http.jsonp($scope.yourAPI+'/?page='+$scope.pageNumber+'&callback=JSON_CALLBACK').error(function(jqXHR, textStatus, errorThrown){
alert("### ERROR ###");
alert(textStatus +' // '+ errorThrown);
alert($scope.yourAPI+'?page='+$scope.pageNumber);
}).success(function(response) {
if($scope.pageNumber > response.pages){
// hide the more news button
$('#moreButton').fadeOut('fast');
} else {
$scope.items = $scope.items.concat(response.posts);
window.localStorage.setObject('rootsPosts', $scope.items); // we save the posts in localStorage
window.localStorage.setItem('rootsDate', new Date());
window.localStorage.setItem("rootsLastPage", $scope.currentPage);
window.localStorage.setItem("rootsTotalPages", response.pages);
// For dev purposes you can remove the comment for the line below to check on the console the size of your JSON in local Storage
// for(var x in localStorage)console.log(x+"="+((localStorage[x].length * 2)/1024/1024).toFixed(2)+" MB");
$scope.totalPages = response.pages;
$scope.isFetching = false;
if($scope.pageNumber == response.pages){
// hide the more news button
$('#moreButton').fadeOut('fast');
}
}
});
}
Here is my config.xml :
<content src="index.html" />
<access origin="*" />
<feature name="http://api.phonegap.com/1.0/network"/>
<preference name="KeyboardDisplayRequiresUserAction" value="true" />
<preference name="MediaPlaybackRequiresUserAction" value="false" />
<preference name="AllowInlineMediaPlayback" value="true" />
<preference name="DisallowOverscroll" value="true" />
<preference name="webviewbounce" value="false" />
<preference name="android-installLocation" value="auto" />
<icon gap:platform="android" gap:qualifier="ldpi" src="www/res/icon/android/android-icon-36x36.png"/>
<icon gap:platform="android" gap:qualifier="mdpi" src="www/res/icon/android/android-icon-48x48.png"/>
<icon gap:platform="android" gap:qualifier="hdpi" src="www/res/icon/android/android-icon-72x72.png"/>
<icon gap:platform="android" gap:qualifier="xhdpi" src="www/res/icon/android/android-icon-96x96.png"/>
<gap:splash gap:platform="android" gap:qualifier="port-ldpi" src="www/res/screen/android/small.png"/>
<gap:splash gap:platform="android" gap:qualifier="port-mdpi" src="www/res/screen/android/medium.png"/>
<gap:splash gap:platform="android" gap:qualifier="port-hdpi" src="www/res/screen/android/large.png"/>
<gap:splash gap:platform="android" gap:qualifier="port-xhdpi" src="www/res/screen/android/xhdpi.png"/>
here is the result of "phonegap plugin list" :
cordova-plugin-whitelist 1.2.2 "Whitelist"
org.apache.cordova.inappbrowser 0.5.4 "InAppBrowser"
org.apache.cordova.network-information 0.2.14 "Network Information"
Can anybody have a solution for me ?

Answer 1

Add this config setting to your config.xml which should resolve the issue:
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />