Unable to Access React Application via Main IP Address (Edited)
After running the npm start and node server.js commands, I am unable to access my React application via the server’s IP address and port. The application is set up to run through Nginx on an Ubuntu 22.04 server. The domain servers have already been added to the DNS settings. What could be the issue?
System Versions:
OS: Ubuntu 22.04 x64
Node.js: Version 18.13.0
Nginx: Version 1.22.0
Nginx Configuration:
server { listen 80 default_server; server_name _;
root /var/www/html; index index.html index.htm index.nginx-debian.html;
location / { proxy_pass http://localhost:3000; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection 'upgrade'; proxy_set_header Host $host; proxy_cache_bypass $http_upgrade; try_files $uri /index.html; } }
Steps I Took:
1. Installed Nginx:
sudo apt-get update sudo apt-get install nginx
2. Modified the Nginx configuration:
sudo nano /etc/nginx/sites-available/default
3. Checked the configuration and restarted Nginx:
sudo nginx -t sudo systemctl restart nginx
Answers
Antonio Sánchez
28 days ago
Rating
The issue might be caused by the following factors:
1. Incorrect Nginx configuration.
2. Firewall blocking access.
3. An issue with the React application itself.
Possible Solutions:
If the issue is with Nginx configuration:
Open the Nginx configuration file for editing:
Update the server block to look something like this:
After saving the configuration, check for errors:
If there are no errors, restart Nginx:
If the issue persists, review the Nginx error logs and provide more details for troubleshooting:
If the issue is related to the firewall:
If you are using ufw (Uncomplicated Firewall), use the following commands:
Allow Nginx through the firewall:
Remove the rule that limits access to port 80 only:
Reload the firewall to apply the changes:
If the issue is with the React application:
Start the application:
Check if the application is accessible:
If the application responds correctly, it means the app is running fine, and the issue might lie with Nginx or network settings.
If there is no response, verify that the app is listening on port 3000:
If the app is not listed, restart it and check the configuration to ensure everything is set up correctly.