Ionic-framework: Ionic proxy does not allow requests to be sent to a CORS protected server.

Created on 30 Jan 2018  Â·  9Comments  Â·  Source: ionic-team/ionic-framework

Ionic version: (check one with "x")
(For Ionic 1.x issues, please use https://github.com/ionic-team/ionic-v1)
[ ] 2.x
[x] 3.x
[ ] 4.x

I'm submitting a ... (check one with "x")
[x] bug report
[ ] feature request

Current behavior:
Ionic proxy does not allow requests to be sent to a CORS protected server.

Expected behavior:
Ionic proxy should allow requests to be sent to a CORS protected server.

Steps to reproduce:
Add "proxies" information to ionic.config.json with a proxyUrl pointed at a CORS protected endpoint. Change provider url to point to localhost. Run ionic serve.

Related code:
ionic.config.json:

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

provider:

...
private apiUrl = '/api';

getApiVersion(): Observable<string> {
  return this.http.get(this.apiUrl)
                  .map(this.extractData)
                  .catch(this.handleError);
}
...

“Proxy added” line in ionic serve log:

Other information:
Console Error (also logged when using DevApp):

Network Request:

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

cli packages: (/usr/local/share/.config/yarn/global/node_modules)

    @ionic/cli-utils  : 1.19.1
    ionic (Ionic CLI) : 3.19.1

global packages:

    cordova (Cordova CLI) : 8.0.0 

local packages:

    @ionic/app-scripts : 3.1.8
    Cordova Platforms  : none
    Ionic Framework    : ionic-angular 3.9.2

System:

    Node  : v9.1.0
    npm   : 5.5.1 
    OS    : macOS High Sierra
    Xcode : Xcode 9.2 Build version 9C40b 

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : pro

Most helpful comment

@medMethnani once again, of course, this will work if I deploy it to a phone. That does not invalidate this issue as the entire point of a service proxy is to allow this to work without having to deploy to a phone during development phase.

All 9 comments

That's right, try to test on a _real device_

@medMethnani I am not sure how that is useful. The idea here is to have the ability to develop the app with livereload and all the dev tooling without having to deploy it to a "real device".
https://ionicframework.com/docs/cli/configuring.html#service-proxies

image

Hello, @jpmckearin in fact what you said is true but the browser add some security and they don't allow local call for some API URLs , in that case it will work on real device, i mean you need to test in Real device:
https://ionicframework.com/docs/intro/deploying/

@medMethnani once again, of course, this will work if I deploy it to a phone. That does not invalidate this issue as the entire point of a service proxy is to allow this to work without having to deploy to a phone during development phase.

@jpmckearin Yes but this is not a problem of IONIC , it's problem related to Web browser, Look try to test in oldest web browser i mean version between 2009 and 2010 it will work for you :)
Look here try if you can some other solution: https://blog.ionicframework.com/handling-cors-issues-in-ionic/

@medMethnani I think you have a fundamental misunderstanding of what a proxy is and why it should solve the CORS issue, regardless of the browser being used. Everything you have linked _literally_, _directly_ supports the case that this is a bug and I _should_ be able to make a request to a CORS protected endpoint using ionic's implementation of service proxies. I understand that older browsers do not implement the CORS standard as it wasn't even a W3C recommendation until 2014. Ionic Service Proxy is _designed_ for the sole purpose of working around CORS limitations during application development. I don't know what else to say regarding the subject.

@jpmckearin I understand i'm trying to give you a solution to get your project done , and the bug has been already reported and the team know about it already, there is no solution in the immediate.

@medMethnani The first comment should have been something like "this has already been reported" and a link to the Github issue. Regardless, I believe this is actually an issue with ionic-cli 3.0+ itself and there is an existing issue on that repo. https://github.com/ionic-team/ionic-cli/issues/1697. Closing this issue in lieu of the other one.

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Was this page helpful?
0 / 5 - 0 ratings