Ionic-cli: Proxy settings not working

[wshaheer]

Short description of the problem:

URLs and paths defined under proxies in ionic.config.json are not being loaded when testing application in browser using ionic serve --browser "google chrome".

What behavior are you expecting?

Send requests to appropriate paths and URLs as defined in ionic.config.json

Steps to reproduce:

1. update to ionic version 2.1.12
2. define proxy paths in ionic.config.json
3. test using ionic serve

// ionic.config.json
"proxies": [
  {
      "path": "/api",
      "proxyUrl": "https://example.com/"
  }
]

Post the output of ionic info below please
Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.12
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.45
ios-deploy version: 1.9.0
ios-sim version: 5.0.10
OS: macOS Sierra
Node Version: v6.3.1
Xcode version: Xcode 8.1 Build version 8B62

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)

Proxy settings not working

[0cv]

Eventually, you need to put a wildcard (was my problem). So something like this as it seems it only matches the relative path:

"proxies": [
  {
      "path": "*/api",   //<= notice here
      "proxyUrl": "https://example.com/api"
  }
]

[ngjonnathan]

Any progress on this issue? I'm using ionic-cli 3.5.0 and i have the same problem (wildcard didn't resolve my problem)

[Qvatra]

Same here:
Wildcard doesn't help
POST http://localhost:8100/api.php 404 (Not Found)

[timler]

I struggled with this for a day and finally got it working by upgrading two dependencies: ionic-angular (from 3.5.0 to 3.5.3) and @ionic/app-scripts (from 2.0.0 to 2.0.2). I'm not sure which finally fixed the problem, but I suspect it was a combination.

I updated the dependencies (described above) in package.json and then ran npm update.

To get the service proxies working, I added this to ionic.config.json:

  "proxies": [
    {
      "path": "/blob",
      "proxyUrl": "https://a.url.com"
    }
  ]

And in my code I used it like this:

    let url = 'blob/api/endpoint?parameter1=somevalue&parameter2=anothervalue;
    console.log('URL: ' + url);
    let headers: Headers = new Headers();
    headers.append('Authorization', 'Basic djskfsajdfklasdjfkladsfjkasd');
    headers.append('Content-Type', 'application/json');
    let options: RequestOptions = new RequestOptions({ headers: headers });
    this.http
      .get(url, options)
      .map(response => {
        let body = response.json();
        console.log(JSON.stringify(body));
        if (body.data) {
          console.log('logged in');
          return true;
        } else {
          // login failed
          console.log('login failed');
          return false
        }
      })
      .subscribe(response => {
          console.log(response);
        }, (error) => {
          console.log(error);
      });

Here is my ionic info:

global packages:

    @ionic/cli-utils : 1.4.0
    Cordova CLI      : 7.0.1 
    Ionic CLI        : 3.4.0

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:

    Node       : v6.11.1
    OS         : Linux 3.13
    Xcode      : not installed
    ios-deploy : not installed
    ios-sim    : not installed
    npm        : 3.10.10 

I hope this helps someone.

[mknutty]

timler, that helped me. I finally was able to find your solution and it worked for me.

[saurabhgupta050890]

Having the same problem when I upgraded ionic cli v3. Used with ionic v1 project and proxies broke as soon as I updated cli and installed required dependency.

Downgraded again to 2.1.15 and everything works fine again.

[mknutty]

saurabhgupta050890, did you try what timler said?

[saurabhgupta050890]

ionic-angular is not a dependency in not my project as its an Ionic 1 project

[psathish18]

after adding proxies in ionic.config.json, try "ionic Build" and "ionic serve".

[tayoraph]

I am having the same issue , please how do I go about this because the recent ionic update is above timler's solution

Please help ....

below is my ionic info

cli packages: (/usr/lib/node_modules)

@ionic/cli-utils  : 1.9.2
ionic (Ionic CLI) : 3.9.2

local packages:

@ionic/app-scripts : 3.0.0
Ionic Framework    : ionic-angular 3.7.1

System:

Node : v8.2.0
npm  : 5.3.0
OS   : Linux 4.8

[ameer-khan]

As mentioned by @Krisa I added wildcard * and It started working. Before that I had also added
ionic cordova plugin add https://github.com/apache/cordova-plugin-whitelist.git

//in ionic.config.json

"proxies": [
  {
      "path": "*/api",   
      "proxyUrl": "http://example.com/api"
  }
]

[MohammedHanfy]

How can I add a Host header to the proxy ?

[yerboogieman]

Hey all,

I was stuck on this issue for a couple of days and almost decided to just not use Ionic, despite the fact that it otherwise rocks! Here is what I found that finally resolved it for my particular situation:

https://stackoverflow.com/questions/43070121/ionic-2-get-http-localhost8100-search-aqquery-404-not-found

Hope this helps any of you who are still stuck on this.

Cheers,
Eric

[ionitron-bot[bot]]

Thanks for the issue! This issue appears to be associated with an old version of the Ionic CLI. Please update to the latest CLI version, which supports all versions of the Ionic Framework. If the issue is relevant and if it persists after updating to the latest CLI version, please create a new issue.

Thank you for using Ionic!