ng serve: support for proxy urls

[reppners]

At development time our teem needs to proxy AJAX-requests with urls that match certain patterns/regexes to a different machine running the application backend.

Is this use-case already covered but not yet documented by ng serve?

If not I would like to propose this as a feature:

• pass an array of strings/regexes to ng serve
• if any of those strings/regexes match the url of the request then proxy the request to a configurable ip/port

If this however is not in the scope of ng serve, what benefits would our team lose if we were NOT using ng serve in the dev-workflow at all?

[dmnk89]

try --proxy http://127.0.0.1:8080

this is from ember-cli and it worked in some previous version

[filipesilva]

We haven't done such functionality no. If you find it working within ember-cli options, please reply here for other people with the same issue.

[fatsu]

Using --proxy http://host:port/context works out-of-the-box with IE & Chrome.

To get it working in Firefox (38), I had to explicitly set the 'Accept' request header to '*/*'.
The call was forwarded, but as the returned response content-type was not in the default accept headers, the index.html was returned instead.

e.g.:

this.http
      .get('/some/api', { headers: new Headers({'Accept' : '*/*' }) })

You could ofcourse also set it to the explicit content type you would be expecting e.g. 'application/json'.

Also, you can set the DEBUG environment variable to * before calling ng serve to get server debugging info. This slows down the server a lot.

SET DEBUG=*
ng serve --proxy http://host:port/context

[bastienJS]

@fatsu @filipesilva Is it possible to save the proxy url somewhere in the angular-cli.json so it is always considered when I just do ng serve ?

[bastienJS]

@filipesilva @dmnk89 seems I did not read what you wrote about the ember-cli file. So I tried to put this in the ember-cli file:

{
   "output-path": "../TGB.Web/wwwroot", // for asp.net core backend
   "proxy": "http://localhost:33333"
}

That works fine!

Of courseits confusing at first time why use ember inside angular... but well it works!

[hantsy]

@bastienJS Angular CLI is based on Ember CLI.

But, how to configure multi proxies?

eg.

/api for http://api.example.com
/mgt/ for https://example2.com/management

[filipesilva]

@bastienJS I'm glad you found a way to persist it! It's counter-intuitive but at least it works for now.

[unrevised6419]

In my case worked this way
Install ember using
npm install -g ember-cli
create file ember-cli-build.js in root folder with this content

/*jshint node:true*/
var EmberApp = require('ember-cli/lib/broccoli/ember-app');
module.exports = function(defaults) {
  var app = new EmberApp(defaults, {});
  return app.toTree();
};

Now you can use

ember generate server
ember generate http-mock
ember generate http-proxy

to generate server, mocks and proxys for angular project, and it works
These commands are listed when ng help generate or ember help generate is entered. There you can see more info!

[filipesilva]

I'd like to mention that with #1455, the native ember-cli support for proxies probably doesn't work anymore.

[mmrath]

@filipesilva any idea/hack to get this working? I have full backend API available, I am developing an alternate client using ng2. So proxy option is very helpful to me for quick demo and testing.