I have a very simple $http post request as shown below. I always get a status code 0 for a request to my webserver running locally. The server side setup is IIS and ColdFusion.
I used http://maps.googleapis.com/maps/api/geocode/json and it works. But my url does not.
I have enabled CORS on my server and i tested it with a online CORS tester as well my own Jquery code that makes a CORS request. It works fine. I see that the response header Access-Control-Allow-Origin is set to . I also have allow-intent href="" set in my config.xml.
I understand the issue appears to be with my url since it works with google maps. But i am posting it here anyway since I could get the CORS request to work with JQUery ajax. The only info I have is that the status code in the error handler is 0, the response , headers etc are all null. THere is no other information anywhere to figure out how to debug this.
On the web browser using ionic serve and a proxy configuration I am able to make web requests successfully. It just does not work when using the android emulator.
One more thing I had to change the default angularjs http provider to encode form variables using
application/x-www-form-urlencoded;charset=utf-8 instead of application/json since my web services are not REST based.
Any help is greatly appreciated. I have lost a day trying to figure this out and I am about to cry :(.
But i am posting it here anyway since I could get the CORS request to work with JQUery ajax.
@pprabhu CORS should be handled on the server side at first. The web server must allow it other wise some proxy configurations must be in place to get around it. That is way ionic serve would work on a browser. What kind of a web server do you have & are you able to configure it correctly?
The web server is IIS with Coldfusion behind the scenes that has the web services. In coldfusion to allow CORS requests is very easy. We just need to add this line of code to the page that is called.
cfheader name=“Access-Control-Allow-Origin” value="*"
I know the CORS requests must work because i used this online tool to test it. http://client.cors-api.appspot.com/client
Also i wrote a very simple jquery implementation in a file sitting on my file system to make the ajax call and that worked as well.
Does IIS configurations allow modifying ‘Access-Control-Allow-Methods’ like so: ‘Access-Control-Allow-Methods: GET, POST, PUT, PATCH, DELETE, OPTIONS’) ? or maybe you can post your test results from the tool!
Maybe also try using a real phone instead, by running:
Yea the web server is running local.WHen you do not specify the methods, it means all methods are allowed. However I did try with Access-Control-Allow-Methods with no success.
I did use ionic emulate android and it gave me an error…but since i cant see the console output i cant say what the error was. Are there any specific response headers that ionic/angular would look for?
Sorry I don’t use IIS, I develop on linux LEMP or LAMP stacks and I also have a LEMP dev server for my development for real testing so I won’t be able to advise on configuring local CORS as it may be a waist of time. I prefer having consistent dev and live environment instead.
Assuming you are running the emulator from cmd, open another terminal and run
adb logcat
I use this with real devices to see all server responses during run time ( note: It will out put all gibberish OS logs as well) and this way again I test on real device rather than an emulator. Push notifications for example can’t be tested on emulators!
Thanks for letting me know abt adb logcat. After turning it on, I get the same exact error, status was 0. So I am almost thinking this is not a CORS issue at all and has to do with something else that can trigger a status of 0. Since the only time CORS is required is for the web browser or a ionic emulate android with livereload.
Again the call with the google maps api worked fine. I am going to try to hit a qa server tomorrow and see if it has anything to do with the fact that the server is on localhost. Also I will try to use CORS to access the api end point with ionic serve. Hopefully chrome wont complain abt the CORS request.
I cant explain the reason why this does not work. Localhost and the name of my computer for the server name fails the $http call. If I use my IPV4 address it works. It also works with maps.googleapis.com. I think it has something to do with the new content-security-policy meta information. i will need to research exactly what to set in it. Just putting this out there in case someone goes nuts with this like i did.