Ionic 4.12 - Running on device gives me CORS error. It ignores proxy config. How to overcome this?

Ionic Framework
1

Hi:

I want to run the app on my device but it gives me hard time: (ionic 4.12).
Running on device gives me CORS error and ignores proxy server config.

It run on localhost:8080 not file:// ? (I test the location at the console of Remote Devices)

10X

1 Like
2

I would need more context to debug. What are your API URLs located at?

3

Hi 10x for the reply:

It doesnā€™t matter which api. you can call ā€œhttp://api.ionic.com/endpointā€.

The problem is that when running on android deivice it turns the webview into localhost:8080 instead of file://.

So how do i debug it?

4

Below link should help.

5

Change your address from http://localhost:8080 to http://IP_Address:Server Port Number.

6

Thanks but does not work

7

10x but this I canā€™t do because this is how ionic run works on device.

It seems the proxy does not work on running in device

8

Since I donā€™t have much information on your ionic version, android platform etc, all I can help you with is links. Look at below links:

https://blog.ionicframework.com/handling-cors-issues-in-ionic/

9

Guys. This is ridiculous. Iā€™ve just spent an hour dredging through Stack Overflow and this forum. As far as I can tell, NOBODY knows how to get Proxies to work for Ionic 4. Can someone from ionic maybe put together a demo app with the right stuff in it and post it somewhere. Thousands of hours are being wasted swearing, that should be spent telling other people how great ionic isā€¦

Personally, Iā€™m trying to use the angular httpClient. I want to create a mobile app and a PWA in the end. I like the way httpClient uses observables. So, I spent about a day or 2, tearing out all the native ionic http stuff. According to at least 50% of the opinionated masses (yes the other 50% were on the fence), this is the right thing to do, for more reasons that I care to elaborate here. However, you know where this is goingā€¦ I get a CORS error on my device when I run devApp or ionic run, so I canā€™t debug on the device. And I have no idea if it will work when built in the end. Since my app is in tatters right now, I just donā€™t have the energy to try.

So, adding proxies to your ionic.config.json doesnā€™t work.
Creating a proxy.conf.json file which holds a target doesnā€™t work, no matter whether you point to it from within your angular.json, or you add it explicitly to the command when you run the serve.

So Iā€™m left with no option but to go back to using the native http and sucking up all the above (not actually) mentioned negatives.

EDIT

Iā€™ve gone back to

import { Http, Headers, Response } from ā€˜@angular/httpā€™;

and CORS errors vanishes. I have no idea why, nor do I want to. Perhaps soetime in 2023 when someone has figured out how to get httpClient to work, Iā€™ll upgrade again.

1 Like
10

That didnā€™t work.

CORS on device just does not work. Because the angular proxy is not activated like on running on browser for some reason

11

This is not a solution for me.

I need to use external library to do my calls.

what the hell ionic 4 did?

at 2 it was much simpler

1 Like
12

@helenakohan see this other post on the forumā€¦ indeed it seems like Ionic 4 somehow quietly dropped proxy support.