Ionic CORS Proxy settings not working

Ionic Framework ionic-v3
1

URLs and paths defined under proxies in ionic.config.json are not being loaded when testing application in browser using ionic serve.
here’s my proxy setting,

{
“name”: “example”,
“app_id”: “”,
“type”: “ionic-angular”,
“proxies”: [
{
“path”: “/api”,
“proxyUrl”: “http://example.com”
}
]
}

but i am not getting the required response when i call /api/details in http get request

2

Is this when deploying to the device or browser?

Aha sorry just read your post again. The browser.

3

Have you followed all the instructions for this?

http://blog.ionic.io/handling-cors-issues-in-ionic/

4

Yes, I set up the ‘Ionic CLI proxy server’ same way as mentioned in the blog.

5

What is the complete output of ionic serve?
Also post your ionic info output please.

6 
@ionic/cli-utils  : 1.7.0
ionic (Ionic CLI) : 3.7.0

global packages:

Cordova CLI : 7.0.1

local packages:

@ionic/app-scripts              : 2.0.2
@ionic/cli-plugin-cordova       : 1.4.1
@ionic/cli-plugin-ionic-angular : 1.3.2
Cordova Platforms               : android 6.2.3
Ionic Framework                 : ionic-angular 3.5.3

System:

Android SDK Tools : 25.2.5
Node              : v6.11.1
OS                : Windows 10
npm               : 3.10.10
7

[INFO] Starting app-scripts server: --port 8100 --p 8100 --livereload-port 35729 --r 35729 --address localhost - Ctrl+C
to cancel
[15:39:47] watch started …
[15:39:47] build dev started …
[15:39:47] clean started …
[15:39:47] clean finished in 21 ms
[15:39:47] copy started …
[15:39:47] transpile started …
[15:39:54] transpile finished in 6.83 s
[15:39:54] preprocess started …
[15:39:54] deeplinks started …
[15:39:54] deeplinks finished in 295 ms
[15:39:54] preprocess finished in 299 ms
[15:39:54] webpack started …
[15:39:55] Proxy added:/api => http://example.com/api
[15:39:55] copy finished in 7.96 s
[15:40:11] webpack finished in 16.23 s
[15:40:11] sass started …
[15:40:16] sass finished in 5.21 s
[15:40:16] postprocess started …
[15:40:16] postprocess finished in 87 ms
[15:40:16] lint started …
[15:40:17] build dev finished in 29.47 s
[15:40:20] watch ready in 32.48 s
[15:40:20] dev server running: http://localhost:8100/

[INFO] Development server running
Local: http://localhost:8100

8

You should upgrade both to recent versions.

This means that the proxy was recognized and added.

What is the code you use to call the API?
What is the exact error you are getting where and when?

9

Did you update the url to which you make the api calls? According to your proxy setup, requests should be done to

Old one :

apiUrl = 'http://example.com/api';

What you should use now :

apiUrl = window.location.origin + '/api';
1 Like
10

Hello!
Having the same issue. I’ve setup a proxy which is added :

Proxy added:/people => https://people.googleapis.com/v1/

I’m sending a request:

this.http.sendGetRequest(‘/people’, ‘’, ‘google’);

via

this.http.get(window.location.origin + url).map(res => res).subscribe(data => {
console.log(data);
});

Config:

“proxies”: [
{
“path”: “/people”,
“proxyUrl”: “https://people.googleapis.com/v1/”
}
],
“watchPatterns”: [
“scss//*",
"www//",
"!www/lib/**/”,
“!www/**/*.map”
]
}

Am I doing anything wrong here? I’m still getting a 404 from localhost:8100/people

11

Upgrading the ionic cli and app scripts fixed the issue for me.

1 Like
12 
{
  "name": "erabell",
  "integrations": {
    "cordova": {}
  },
  "type": "ionic-angular",
  "integration": {
    "cordova": {}
  },
  "proxies": [
    {
      "path": "/wc-api/v3/products",
      "proxyUrl": "http://localhost:8100/wc-api/v3/products/endpoint"
    }
  ]
}

here is my ionic.config.json file code,but i steel face an error.please tell me where is the error
13

Use your localhost like this: http://localhost:8100/api
this will be work

14

I have the same issue too

15

I have the same issue too