Using a webpack-dev-server proxy

Ionic Framework ionic-v3
1

Hello,
I am trying to use the webpack-dev-server proxy in order to get around CORS while developing in the browser with ionic serve. As far as I can see, ionic2 is not using the ionic.project file any more and hence old solutions centred around that don’t seem to work. Therefore, I added

    devServer: {
    hot: true,
    historyApiFallback: true,
    proxy: {
        '/api*': {
        target: 'http://api.awesome.com',
        secure: false,
        }
    }
    }

to my webpack.config.js. The configuration works when running it with webpack-dev-server directly as in

$ webpack-dev-server

However, it does not work when using

$ ionic serve

Clearly, this is inconvenient since I don’t want to miss out on the automatic build process provided by the latter if I change some files in my project.

Does anybody know how to use ionic serve with a proxy?

Thanks,
Chris

2

hi @chrisboo

I’ve successfully updated usage of proxy in ionic2 project:

Open ionic.config.js and add this in proxies part:

    "path": "/twitter/",
    "proxyUrl": "https://api.twitter.com/"
  }],

In your app, make a request like this:

      .subscribe(
        data => {
        // we've got back the raw data, now generate the core schedule data
        // and save the data for later reference
        this.data = data;
      });

The proxy will redirect your request from localhost/twitter/oauth2/token/ to https://api.twitter.com/oauth2/token

You are done and can now use ionic serve as you normally would. :slightly_smiling:

1 Like
3

I’m looking for that proxies a few day … added a proxies as you put it there but now returns me this error:

POST http://localhost:8100/api/acesso net::ERR_CONNECTION_REFUSED

What might be happening?

4

My fault, when I started ionic serves the first time I chose the IP number, not localhost … so instead of using the http: // localhost: 8100 was only using http://192.168.0.28:8100

Thanks !!