angularangular2-cli

How can I get my app (running via ng serve) to connect to a Node back-end while preserving the auto-reload functionality?


I've just migrated my application to Angular CLI. I already have my REST API Node server up and running. I would like to be able to run my front-end with ng serve, to have the auto-reload feature every time I change a file, but also have it connect to my node back-end.

Livereload server is running on port 49152 Serving on port 4200 Node listening on port 8080

All my node routes are prefixed with api.

Is this possible?


Solution

  • So because a formal answer hasn't been submitted for this, I'll give it a shot. Say you have your node powered api running on 8080. You can get that started in one terminal/cmd window with your typical node server.js command. Then, in the same project folder, the same one you have your package.json you will want to add a proxy-config.json file with the following content

    {
        "/api": { // or whatever your endpoint is in your api routes
            "target": "http://localhost:8080", // your node server.js api
            "secure": false
        }
    }
    

    Then you can start your project with ng serve --proxy proxy-config.json.

    Docs: https://github.com/angular/angular-cli/blob/master/docs/documentation/stories/proxy.md