PhoneGap Ionic project not performing $http.post on iOS device

Question

I am using the Ionic framework to build an html5 app that is then deployed to an iOS device with PhoneGap. Everything was working great, then we switched some server addresses that were being used to get data to include a port number in the address and the HTTP method was switched from a GET to a POST. After the switch we tested locally in the browser and it was pulling data with no problems. When we deployed to the device we saw nothing in the logs when the request was executed, and the success or error handler was never reached. In the code below only "HERE1" is printed and everything stops.

console.log("HERE1");
$http.post("http://XX.XX.XX.XX:81/api/Authenticate", null ,{ headers: {'Authorization': 'Basic ' + encodedNamePw} })
            .success(function (data, status, headers, config) {
                console.log("HERE2");
            })
            .error(function (data) {
                console.log("HERE3");
            });

I then tried to perform a GET to the same address and I got a response, saying that I obviously had the incorrect method. I then tried a POST to the address without a port and I got response, which was again an error, but at least I got a response. So to summarize it works locally in browser, it works on the iOS device with a GET request and a PORT, but it does not make any request when I use the POST method. I did try to escape the colon but that did not help. I'm pretty baffled by this one so any thoughts are appreciated. Thanks!

Answer 1

After much pain an agony I found the issue and the options available. The issue was that we were getting a 401 response and a www-authenticate http header. When this is sent by the server apparently iOS tries to pop a login dialog, which is blocked by PhoneGap. Instead of hitting the error callback method it just eats it and you never get any feedback that the request has completed.

The best solution requires you to have access to the server you are calling. If you do, and you can update the response to not send a www-authenticate header for 401 responses then you are golden and it works as expected. If you can't then you have the option to set the async option to false on the request. This approach will block at the UI, which is not ideal, but may be acceptable if it is just a login request. Best of luck.