Proxy Problems with Ionic

TheMockGraeme · February 10, 2016, 11:24am

I’m having trouble with CORS, and am having problems with the proxy settings.

If I set up a proxy in my ionic.project as so:

{
  "name": "MyApp",
  "app_id": "12345678",

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

And then invoked as:

this.http.get('/api')
  .map(res => res.json())
  .subscribe(
    data => /** Process success */,
    err => /** Handle error */,
    () => console.log('API called'));

I get a 404 error, and digging into it get a message that localhost:8100/api cannot be found.

Does the Proxy code work with Ionic 2? If so, am I missing something?

Thanks.

Yes, I could run the app on my phone, but Google are doing their level best not to deliver a USB-A to USB-C cable. And our server dev is somewhere in Iran. No, really.

jarnix · February 10, 2016, 1:00pm

I have the same problem, the proxy functionality doesn’t seem to work

fefelegal · February 10, 2016, 1:13pm

Take a look here: 404 error loading image android device

Hopefully your problem has the same solution

Peekmo · February 22, 2016, 10:13am

Hello,

I have the same issue, and the fefelegal’s link is not the solution (as the problem is in the browser and not in my device)

Regards,
Peekmo

yasuokawachi · February 25, 2016, 2:46pm

same with me.
http://localhost:8100/apiaddress from browser does not work. It looks the server do not act on ionic.project. Even if i change the name of ionic.project, ionic serve does not complain with it.

maciejkoch · February 25, 2016, 2:52pm

You have to set proxies in ionic.config.js, i.e:
module.exports = { proxies: [{ "path": "/twitter/", "proxyUrl": "https://api.twitter.com/" }], }

yasuokawachi · February 26, 2016, 6:38am

It was big help. With your configuration to js file, proxy start working. Thank you.

7200rpm · April 19, 2016, 5:10pm

Now that ionic.config.js is no longer being used in the latest beta, do you know where this code would go?

kattasrinu · April 20, 2016, 9:35am

In ionic2 ionic.config.json is working for me am using beta version only. And this is my proxy:

{
  "name": "myApp",
  "app_id": "",
  "v2": true,
  "proxies": [
    {
      "path": "/api",
      "proxyUrl": "http://xxxxxxxxx"
    }  
  ]
}

  this.http.post('/api'+"username="+username+"&password="+password)
    .map(res =>res.json())
    .subscribe(data => {
      this.data = data;
    })

evandrojr · May 1, 2016, 3:19pm

I need to make proxy work in ionic 2. I used to have it set at ionic.config.js and it was working well. Now ionic.config.js is deprecated and I don’t know how to use proxy anymore.

iignatov · May 1, 2016, 3:37pm

@evandrojr The answer is right above your question:

kees.schouten · May 15, 2016, 3:46pm

This works quite fine for basic proxying. But the headers seem to be ignored (e.g. for basic authentication). Is there an option to pass these through as well?

iignatov · May 15, 2016, 4:46pm

It doesn’t seem so but you could open a new issue or feature request.

mburger81 · August 10, 2016, 9:56am

Hi @kattasrinu,

i configured out my ionic.config.json file as you described

{
    "name": "web-client-ionic2",
    "app_id": "",
    "v2": true,
    "typescript": true,
    "proxies": [
        {
            "path": "/api",
            "proxyUrl": "http://192.168.1.1"
        }
    ]
}

and my store is this

import { Http, Headers } from '@angular/http';
...
var httpCall = this.http
               .post('/api/v1/users/log  in', JSON.stringify(body), {headers: headers});
               //.map(res => res.json());

return httpCall;

But I always get 404, it seems proxy configuration is not working, I’m using ionic2 beta.11

some ideas?

nessgor · August 12, 2016, 2:51pm

Same issue here, using ionic2 beta.10

{
  "name": "",
  "app_id": "",
  "v2": true,
  "typescript": true,
  "proxies": [
    {
      "path": "/pdf_file",
      "proxyUrl": "http://xxxxxxxxx/pdf"
    }
  ]
}

shows 404 file:///pdf_file/pdf-test.pdf not found

mburger81 · August 12, 2016, 5:32pm

I don’t know what I have done but after a while the proxy works fine!
Did you stop and restart ionic serve after change proxy settings?

vagnnermartins · August 12, 2016, 7:33pm

Hello, I’m starting in ionic2 and I have the same problem, below you can see my configuration

ionic.config.json:

{
“name”: “bt-v2”,
“app_id”: “”,
“v2”: true,
“typescript”: true,
“proxies”: [
{
“path”: “/parse”,
“proxyUrl”: “http://appbt.metasix.solutions/parse”
},
{
“path”: “/feed”,
“proxyUrl”: “http://appbt.metasix.solutions/node”
}
]
}
----------------------------
Provider:
load(){
if(this.data){
return Promise.resolve(this.data);
}
return new Promise((resolve, reject) => {
//https://randomuser.me/api/?results=10
this.http.get(’/feed’)
.map(res => res.json())
.subscribe(data => {
this.data = data.results;
resolve(this.data);
}, err => reject(err));
});
}

bsakweson · September 8, 2016, 1:59pm

Unless I am really missing something this should work but no way it is not. I have configured a proxy as stated above in my [ionic.config.json] but still no luck with POST requests.

{
  "name": "*******",
  "app_id": "******",
  "v2": true,
  "typescript": true,
  "proxies": [
    {
      "path": "/api",
      "proxyUrl": "http://localhost:8080"
    }
  ]
}

I want to add this api works flawlessly from command line using curl.

guduri · September 13, 2016, 8:02pm

@kees.schouten Were you able to pass the headers? I have similar issue, I got the proxy working but looks like header information seems to be ignored.

kees.schouten · September 14, 2016, 7:16am

No I did not. But ended up using Chrome with the following startup variables (OSX):

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --disable-web-security --user-data-dir ~/Library/Application Support/Google/Chrome/Default &