How to access AngularJS application on Azure Virtual Machine? - node.js

I've both NodeJS and AngularJS applications. I'm using npm install to download the app's dependencies for both the application. The NodeJS application runs on port 4000 and AngularJS application runs on port 4200. I can access APIs from NodeJS application in the browser and cannot access the application's UI(AngularJS) in the browser. I have deployed these applications on Azure Virtual Machine.
I have opened the ports 4000 and 4200 in the network settings of Azure VM. I'm using npm start command to start both the applications. NodeJS working fine as like in the local machine but not the same case with AngularJS. There is no errors or warnings from AngularJS side. It shows that the app is listening on http://localhost:4200/ and it is not accessible.

In this case, you need to run ng serve --host 0.0.0.0 to allow that your AngularJS application is listening on 0.0.0.0 for outside connecting. You could refer to this How to allow access outside localhost

Try using:
ng serve --open --host 0.0.0.0 --disable-host-check

Related

Local Angular server and Local node server not working for external devices

I'm developing my MEAN application fully locally (Angular frontend and Node Backend). To test this I'm using my mobile with angular command ng serve --host command. When I run my application data from the local node server not loading to mobile but it works with the Laptop browser.
You would need to do following steps:
(1) Ensure that your local machine and mobile phone are on same WiFi network.
(2) Get your local machine IP Address. It will be something like e.g. 184.192.108.xx
(3) Run angular application with command ng serve --host 184.192.108.xx
You can specify the --port and --live-reload options.
https://angular.io/cli/serve
Thanks!

Angular5: Deploying Angular application to multiple clients locally

How can I run AngularJS for multiple clients locally with LAN wires?
Give instruction how to do it
I assume you are asking about accessing to your local build from other machines in your network for developing purposes.
Run command:
ng serve --host=0.0.0.0
Where 0.0.0.0 is IP of your machine.
In case you get "Invalid Host Header" error, use ng serve --host=0.0.0.0 --disable-host-check

how to connect an angular app on public ip to a node app on local server?

I have an angular 4 and a node app. I connect them with HTTP services. now I put them on a local server with 192.168.x.y IP. I start my angular app by:
ng serve --port 8080 --host 192.168.x.y --public 151.233.t.z which 151.233.t.z is my public IP. and finally, I run my apps by: pm2 start npm -- start and pm2 start index.js.(my node server is listening on port 3000) and in the HTTP services I send my HTTP request to http://192.168.x.y:3000. when I open the browser on 151.233.t.z:8080 on a local system everything is ok. but when I try outside the network I just can see my angular app and when I click on a button to send post request for login, it's not working!

nodejs http-server, can't connect localhost

I am using nodejs http-server for a web application. I am able to launch the http-server by running nom start. I can access my server through http://127.0.0.1:8080 but I can't connect by http://localhost:8080. I have checked that localhost can be ping from my terminal and localhost works fine with other server such as tomcat. So I think the problem relates to http-server only. Is there any configuration I need to setup on my application in order to support localhost access?

can not visit the web app made of angular cli on the digitalocean

I have built a simple web app using angular-cli 2,it works well in the local machine. now i tried to deploy it onto a digitalocean server,
however when going to the web server link with http://ip address:4200, i can't visit the web app.
Note: I can make sure the firewall is open to the web application on that port since in ufw status shows 4200 ALLOW Anywhere
You need to serve the actual ip address of the server, by default ng serve will use the loopback address. You can achieve this with:
ng serve --host 0.0.0.0

Resources