question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Port/address binding issue using ng-serve

See original GitHub issue

Versions

Angular CLI: 1.5.0
Node: 9.2.0
OS: linux x64
Angular: 5.0.0
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cdk: 5.0.0-rc0
@angular/cli: 1.5.0
@angular/material: 5.0.0-rc0
@angular-devkit/build-optimizer: 0.0.32
@angular-devkit/core: 0.0.20
@angular-devkit/schematics: 0.0.35
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.8.0
@schematics/angular: 0.1.1
typescript: 2.4.2
webpack: 3.8.1

Repro steps

It might be useful to read the last paragraph to understand the issue first.

  • Bind on port 80 + address 127.0.0.3 with 3rd tool. Example:
authbind nc -l -p 80 -s 127.0.0.3
  • Make sure that you’re binding using netstat:
Proto Recv-Q Send-Q Local Address           Foreign Address         State       PID/Program name    
tcp        0      0 127.0.0.3:80            0.0.0.0:*               LISTEN      26166/nc            
  • Start Angular CLI as following:
authbind ng serve --port 80 --host 127.0.0.2

Observed behavior

Angular CLI answer that the port is already in use …

Port 80 is already in use. Use '--port' to specify a different port.

This answer is coming from portfinder#getPort. I listen to you:

It’s an issue in portfinder !

Well, I don’t think so. Even if the documentation of portfinder is not explicit, by definition, portfinder try to find a port … So, as I understand, we should change the testing procedure in Angular CLI (utilities/check-port.js) to only test the given port with given address otherwise default value 0.0.0.0.

Furthermore, portfinder is testing all the ports and binding addresses ! WTF ?! I might be (for sure) a big improvement to test only what we have to use.

Desired behavior

Do not test all the ports and binding addresses !

Mention any other details that might be useful (optional)

Let me introduce the way I work to understand the issue. When I develop an Angular app, I have so many times constraints linked to CORS. I try to be as close as possible then a production environment using domain name resolution and address binding on localhost. In my setup I have a backend API and its front-end using Angular CLI (only for development purpose). Here is my development network setup:

  • Frontend: domain=myapp.com address=127.0.0.2 port=80
  • Backend: domain=api.myapp.com address=127.0.0.3 port=80
  • !! Obviously nothing is listening on 0.0.0.0:80 !!

Thus I’m starting Angular CLI with options ng serve --port 80 --host 127.0.0.2 (...). In order to use port 80 as non-root user, I’m also using authbind (any way).

The issue is that I get the following error:

Port 80 is already in use. Use '--port' to specify a different port. 

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

2reactions
tiaguinhocommented, Jan 8, 2019

@filipesilva #13292 was merged, this can be closed.

0reactions
angular-automatic-lock-bot[bot]commented, Sep 9, 2019

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to allow access outside localhost - angular - Stack Overflow
ng serve --host 0.0.0.0 will allow you to connect to the ng serve using your ip instead of localhost. Open your browser to...
Read more >
How to avoid 'Port 4200 is already in use' error with Angular ...
Step 1: Find the connection's PID · Step 2: Kill the process using it's PID · Step 3: Restart your server · Step...
Read more >
How Do I Configure the Web Server Port in the Angular CLI?
You'll notice the first line on the console shows the port number: Load the browser to http://localhost:8080:.
Read more >
ng serve - Angular
Option Description Value Type Default Value ‑‑hmr Enable hot module replacement. boolean false ‑‑host Host to listen on. string localhost ‑‑open Opens the url in default...
Read more >
ng serve port number change - Angular Wiki
By default Angular CLI ng serve command uses port 4200 to run the application. ** Angular Live Development Server is listening on localhost:4200 ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found