Hey all I'm having an issue pulling up my website on my desktop. On my laptop where I created the app and did all the code my React app works fine and updates however on other machines only my components/elements load while my axios requests are returning (404 connection refused error). Any tips or fixes? P.S This is my first time trying to deploy an app build to a webserver (digitalocean/NGINX).
NGINX config file
server {
listen 80 default_server;
listen [::]:80 default_server;
root /var/www/epenn92reactapp.space/html/among-us-reactapp3/client/buil>
index index.html index.htm index.nginx-debian.html;
server_name epenn92reactapp.space www.epenn92reactapp.space;
error_page 405 =200 $uri;
error_page 404 /index.html;
location ^~ /assets/ {
gzip_static on;
expires 12h;
add_header Cache-Control public;
}
location /v1/api {
proxy_http_version 1.1;
proxy_cache_bypass $http_upgrade;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_pass http://64.227.5.159:8080;
try_files $uri /index.html;
}
listen [::]:443 ssl ipv6only=on; # managed by Certbot
listen 443 ssl; # managed by Certbot
ssl_certificate /etc/letsencrypt/live/epenn92reactapp.space/fullchain.pem; >
ssl_certificate_key /etc/letsencrypt/live/epenn92reactapp.space/privkey.pem>
include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot
}
server {
if ($host = www.epenn92reactapp.space) {
return 301 https://$host$request_uri;
} # managed by Certbot
if ($host = epenn92reactapp.space) {
return 301 https://$host$request_uri;
} # managed by Certbot
listen 80;
listen [::]:80;
server_name epenn92reactapp.space www.epenn92reactapp.space;
return 404; # managed by Certbot
}
Example axios Route
const [chars, setChars] = useState([]);
useEffect(() => {
const fetchData = async () => {
try {
let res = await axios.get('http://localhost:8080/api/v1/character', {
});
setChars(res.data)
}
catch (err) {
console.log('error', err)
}
};
fetchData();
}, [chars.length]);
Server.js file
const PORT = process.env.PORT || 8080
package.json
"proxy": "http://localhost:8080/"
I've been reading around for about a day now and I'm just not sure what to do any help would be great thanks!