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
Related
Original port for my Storybook installation was port 8080 and 6006 see documentation enter link description here, and figured to change the JSON file to point to port 80
This is the package.json file part of my Storybook installation:
Now I've assigned a domain name since port 80 is hosted under the public ip, the problem is after a while that port closes and we can't see the Storybook because the port is closed again. How do I configure so that the port stays open? I'm using Jelastic as a web hosting environment: https://jelastic.com/
My current configuration is as followed:
Running a VPS with Ubuntu 18.04 installed
Other dependencies:
NPM
Yarn
NodeJS
Create React App : https://reactjs.org/docs/create-a-new-react-app.html
StoryBook for React : https://storybook.js.org/docs/react/get-started/introduction
Chromatic : https://www.chromatic.com/
Storybook's webserver is not meant to be exposed to the internet, it's only for local development. You can create a static build of your Storybook using yarn build-storybook and upload that to any hosting provider. However, since you're using Chromatic, you don't have to, because it gives you free hosting out of the box. See https://www.chromatic.com/docs/document#direct-access-to-your-storybook for details.
I run my app to my local machine via ssl like this:
ng serve --ssl --host: 0.0.0.0
so it is up at: https://localhost:4200
I also using my ipv4 adress which is: XXX.XXX.XX.XXX to make my requests to the server via my services, so i make my api calls like this: https://XXX.XXX.XX.XXX:80/api...
In my back end, I have created an https server so my API calls are been made via https
Everything works great to my desktop
Problem is: The app wont cast to ther devices.. it wont even load and
after some time i get the msg this site cannot be reached
The built in webpack server that is used for ng serve is not meant for production or sharing to other computers, it is only supposed to work on local for development because of security reasons. You should consider hosting a compiled version with a separate web server such as nginx. If you absolutely NEED the built in webpack one to work, you can force it to bind to all of your IP addresses with this:
ng serve --host 0.0.0.0
You may need to disable the host check as well:
ng serve --host 0.0.0.0 --disable-host-check
You can access this, but you might need to turn off your Firewall, this mostly happens in windows machines.
Try turning it off and accessing the IP from other machine.
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
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!
I am creating one application that needs to be made on staging server from one point. Because creating it on local is impossible as it has some endpoints that other servers in network has to access.
I have created an application in Vue.js and Laravel. In local, I used to run npm run hot so that I don't have to re-compile when I change some code. But as I have to continue developing this application on a live server, I want to run npm run hot on a custom domain like staging.something.com instead of localhost:8080.
I don't have any issue if somehow localhost:8080 co-operates but when I run npm run hot on a live server, Here is the error I get when I try to access the web application.
GET http://localhost:8080//js/app.js net::ERR_CONNECTION_REFUSED
I think it should show IP address of my server instead of localhost. I don't know what's wrong with this but it's not working.
Laravel mix uses the webpack-dev-server package for the run hot command.
webpack-dev-server has a switch --useLocalIp which will make it use the servers local IP address.
It also has a --host switch which can be used to set the IP address manually --host 0.0.0.0