Timed Out Connection Error React to Express Server on EC2

user_9243973 0
Viewed 329

Im trying to access my Node/Express Server using a fetch/axios GET request on React

This IP is the Private IP to the server so it has been Xed out

axios.get('http://172.xx.xx.xxx:5000/api')
        .catch(function (error) {
            console.log(error);
        })

This is Express Code

const express = require('express');
const cors = require('cors');
const app = express();

app.use(cors({origin: true, credentials: true}));


const port = 5000;
app.listen(port, () => `Server running on port ${port}`);



app.get('/api', cors(), (req, res) => {
    console.log("HELLO")

})

I get a Error: Network Error

Im assuming this is a secuirty policy on AWS EC2

However When i do a curl 172.xx.xxx.xxx:5000/api

My Node server then prints out Hello, so it is accesible but not via the front end react. (This is curled on the same server running both Express/React

This is my Inbound rules, i havent touched any VPC stuff not sure if i need to I enabled all ports just to check (not be the case in production)

enter image description here

I also do not have a firewall running on my server (nothing appeared when ufw status command was ran)

Where I am i going wrong for me to make a Request from React to Express

Thanks in Advance

EDIT ADDED DEVELOPER TOOL SCREENSHOT

enter image description here

reactjs node.js amazon-web-services amazon-ec2 networking
4 Answers

try to run: sudo iptables -I INPUT -p tcp --dport 80 -j ACCEPT from your ec2 instance

user_129931130

Though I don't fully understand your requirement, I believe you have express/react running on same server and also you need to hit express from you local machine.

So here are my two cents:

  • Inside same server, both would be able to access each other on localhost:. Hence running on production and since you are having single server use localhost. Expose only react's port i.e tcp 3000 on 0.0.0.0/0 & ::/0

  • If you are trying to hit express from local machine and localhost while trying to run react on localhost, you should be hitting public IP of your instance ex: 192.168.12.14:express-port, and would require opening up that port on tcp to 0.0.0.0/0 & ::/0

user_90192630

Reading through, Initially, my suggestion would have been that you install PM2 on your instance since it is a Node project, you can find it here https://www.npmjs.com/package/pm2 (It keeps your server live and you can see with is running and stuffs). But, since you said it works with CURL, then you should check your Inbound rules. Here is an example Inbound Rules Which just includes support of HTTP and HTTPS.

user_134479010

It is your browser that ends up making the request to your private IP address. CURLing works because once you've SSHd to either of your instances, your private IP address is valid.

When the React app makes this request in the browser, the private IP address doesn't actually go to the instance as you'd expect.

You'll need a reverse proxy server or load balancer that can proxy requests and change their origin from public IP to private IP. NGINX or http-proxy-middleware can help you accomplish this.

user_129615180
Related