pythonnginxbackend

Why my request from frontend to backend doesn't work on VPS Server?


Why I get such error when doing requests to server on VPS Server? I'm trying to receive list of images and json file, but receive such error, tried multiple decisions, but it still doesn't work. It works okay locally, but on VPS it gives such error

Error:

GET http://127.0.0.1:5000/api/cosplays net::ERR_CONNECTION_REFUSED.

index-SBna1bPf.js:24 Error fetching cosplays: ae {message: 'Network Error', name: 'AxiosError', code: 'ERR_NETWORK', config: {…}, request: XMLHttpRequest, …}code: "ERR_NETWORK"config: {transitional: {…}, adapter: Array(3), transformRequest: Array(1), transformResponse: Array(1), timeout: 0, …}message: "Network Error"name: "AxiosError"request: XMLHttpRequest {onreadystatechange: null, readyState: 4, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, …}stack: "AxiosError: Network Error\n    at k.onerror (http://[my_ip]/assets/index-SBna1bPf.js:10:5959)\n    at bn.request (http://[my_ip]/assets/index-SBna1bPf.js:12:2060)\n    at async _ (http://[my_ip]/assets/index-SBna1bPf.js:24:2740)"[[Prototype]]: Error
_ @ index-SBna1bPf.js:24
await in _
(anonymous) @ index-SBna1bPf.js:24
ia @ index-SBna1bPf.js:1
(anonymous) @ index-SBna1bPf.js:4
hr @ index-SBna1bPf.js:4
Xt @ index-SBna1bPf.js:4
Uh @ index-SBna1bPf.js:47
(anonymous) @ index-SBna1bPf.js:51
index-SBna1bPf.js:10
Copy   GET http://127.0.0.1:5000/api/cosplays net::ERR_CONNECTION_REFUSED
(anonymous) @ index-SBna1bPf.js:10
xhr @ index-SBna1bPf.js:10
bl @ index-SBna1bPf.js:12
_request @ index-SBna1bPf.js:13
request @ index-SBna1bPf.js:12
bn.<computed> @ index-SBna1bPf.js:13
(anonymous) @ index-SBna1bPf.js:8
_ @ index-SBna1bPf.js:24
(anonymous) @ index-SBna1bPf.js:24
ia @ index-SBna1bPf.js:1
(anonymous) @ index-SBna1bPf.js:4
hr @ index-SBna1bPf.js:4
Xt @ index-SBna1bPf.js:4
Uh @ index-SBna1bPf.js:47
(anonymous) @ index-SBna1bPf.js:51

Solution

  • The error occurs because you're making requests directly to http://127.0.0.1:5000/api/cosplays. When making requests from your frontend to your backend, you should use relative URLs like /api/cosplays instead.

    Example of correct usage:

    // Instead of this:
    axios.get('http://127.0.0.1:5000/api/cosplays')
    
    // Do this:
    axios.get('/api/cosplays')