Ionic app REST calls to webapi hosted on localhost works using ionic serve, but not when I use "ionic run"

Question

Using Ionic serve -- My Ionic app returns data from my REST call to my webapi running on localhost.

But when I issue Ionic run , my REST API call fails. The error.data is blank, so I can't tell what the error is.

I am also able to hit the api of the rest call directly in my browser and see that it returns the data.

Would anybody please give me some pointers as to how to debug this, or why my http calls are failing in run mode?

Answer 1

ionic serve run on browser and ionic run with devices[ios or android]

change localhost to ip address(in your system)

ex- 198.1.1.0:4000(eg.4000 is port number of local server)

and type(CLI)

ionic serve --address 198.1.1.0

check on Mobile browser type 198.1.1.0:4000

Note

Answer 2

If you are using a live server for your REST application,you will run into CORS issues.

I would suggest, you use Ionic's proxy server to do all your request. You will not run in any OPTION request or null request response etc etc.

Check This Official Blog and, This will also be very helpful Ionic Proxy Example

Answer 3

localhost server is only accessible from your local environment (laptop). Assuming you are running on an actual device, it cannot access that web api in a normal way.

You can use following steps:

1. Open hotspot from your device

2. Connect your laptop to the network

3. Open terminal and type in ipconfig

4. Call your REST with the specified IP address.

You can find detailed reference here. How can I access my localhost from my Android device?

Answer 4

I found the solution to my problem in this blogpost. It explained the network host configuration used by GenyMotion emulator : http://bbowden.tumblr.com/post/58650831283/accessing-a-localhost-server-from-the-genymotion

Using this I was able to get the ip address that I should use when invoking my service, that was hosted on my local IIS server.