how to solve my API connection error via Angular? - node.js

I have started to develop a website with Angular and NodeJS but I am facing a problem since a few days.
(For information: I work on a VPS which is external)
So my site is running on port 4200 of the IP of my VPS and is secured via a domain name in HTTPS, so I try to make a request to my API which is running on port 3000 of my VPS but when I put "http://localhost:3000/api/commands" I have the attached error in my web console.
Thank you in advance for your help! Image of my error in my web console
EDIT : If I replace localhost with the ip of my VPS, I get a "Mixed Content" error

Related

How can we use same domain for laravel (https//:example.com) and nodejs (https//:example.com:8443) on AWS EC2?

I have created a Laravel application and used node js with socket.io for the chat and I want both the application to run on the same domain and my website is hosted on the AWS server. I had installed an SSL certificate using ACM
When I open my Laravel website (https//:example.com) on a browser it is working fine but when I tried to open the Nodejs application with port (https//:example.com:8443) browser said 'This site can’t be reached' and I am getting this error 'ERR_CONNECTION_REFUSED'.
I have already added port 8443 in inbound rules
see screenshot
Can you check whether you have allowed the 8443 port in the ufw.
https://www.digitalocean.com/community/tutorials/how-to-set-up-a-firewall-with-ufw-on-ubuntu-18-04

Deploy Create-React-App on a remote Windows Server

I am an inexperienced intern working with a remote Windows Server and React. The Windows Server is running in the company network. I have created a dynamic React website with a NodeJs backend and React Router. I have only ran it on the localhost development server. I want to try to deploy it on the remote Windows Server and give it a custom domain name (Something which can be accessed like servername/myreactapp/).
So far, I have had no success trying to make it work with IIS, even with a web.config file (I get 404 and 500 errors). I am currently making it work by actually running the development server and the nodejs server in the Windows Server, and I access it through the server IP at port 3000.
An improvement would be to be able to access the port through the server name (like servername:3000, instead of the server_ip:3000), but ideally I want to be able to access it like servername/myreactapp/.
Any help would be appreciated. Thank you very much.
The simple solution would be to run your app on port 80 then you will not have to specify the port number.
The best solution would be to set up Nginx on the server and proxy_pass / route to port 3000.
If its running on localhost, which would be port 80, the url would be like http://your_server_name:80, and would be accessible by anyone on the same network, as long as your authentication allows it.

How to connect node app to node api with Nginx

I built a Node app using this tutorial. Then I built a Node API using this tutorial. The app uses the app on port 4000 to connect to the API which then connects to a mongodb to store the info on the server.
This setup works great on my local machine, but I'm trying to deploy it on a digital ocean droplet. I have Nginx setup to listen to port 8080 for the main app. I'm able to navigate to the app. But when I try to register a user and submit the data to the API I get the following error in my browser OPTIONS http://localhost:4000/users/register net::ERR_CONNECTION_REFUSED.
I suspect I have to specify something in the Nginx config files. Or would it be a ufw issue? Any help would be much appreciated.
The error is very clear. The application try to fetch on localhost:4000, so you expect any visitor of your web app to have the API launched on their own computer.
Change your code to point to the correct host and port of you server.
Then, as you guess it, you will have to create a little Nginx configuration to tell him what to proxy to the APP and what to proxy to the API.

MEAN Stack - Angular can only Communicate through the domain name

I have setup a Mean stack on a Digital Ocean Droplet based on UBUNTU 18.
I am using Angular6 on nginx port 80, nodejs on port 3333 which I run on the same machine. I have also enabled CORS on nodejs. The angular application gets build as prod and copied to the server. I have enabled as described on digital ocean the private ip and i can successfully curl the api (nodejs) using localhost, the internal IP and 127.0.0.1
Now the problem: When I am calling the API from the angular6 anything but the domain name is giving me an Error -> Connection Refused, Unknown Error! Locally on my development PC everything is working as It should! I thought it might be a cors issue but I am able to access via IP the remote API from my development machine without any issues. What am I missing? I find it very odd to be able to access it through the domain name and not via the internal IP...
Note that on the development PC angular is running as ng serve... the only difference is that the application is build as prod before uploading it to the remote server.
Angular cant access the private ip because the angular code runs off your browser and not the server. So unless your running the browser right on the server via vnc or something, your local machine cant access the private network (and thus the private ip).
Digital ocean probably recommend you set up a private ip so that you can put your database in the private network so its firewalled off.
Anyhoo, use the FQDN or the public ip in your angular code.

IIS 7.5 and node.js HTTP requests work on VPS but not outside the VPS

I hired a VPS (Windows Server 2008) with the aim of hosting a website. So i configured IIS 7.5 to run a html website. The website reads data (HTTP GET requests) from a little node.js application running on the same VPS on port 3000. I am getting the data as follows:
$.get( "http://localhost:3000/myfunction", function( data ) {
});
Inside the VPS if I go to chrome a type localhost it works perfectly. On the other hand if i insert the VPS's IP address the HTTP calls are not working...
Chromes JS Console says:
Failed to load resource: net::ERR_CONNECTION_REFUSED http://localhost:3000/myfunction
I need the node.js app not to be visible from outside the VPS so that sensible data in the code is not reachable...
I finally managed to solve this using a reverse proxy (IIS's ARR and URL Rewrite) as it is explained in the following guide:
http://www.gitshah.com/2013/06/how-to-use-iis7-as-front-end-to-java.html

Resources