Could not proxy request /pusher/auth from localhost:3000 to http://localhost:5000 (ECONNREFUSED)

Question

I am trying to create a chat app using reactJS and pusher, i am getting this error-

Could not proxy request /pusher/auth from localhost:3000 to http://localhost:5000 (ECONNREFUSED)

in package.json file i have set proxy as-

"proxy": "http://localhost:5000"

and my localhost is defined as 127.0.0.1 in /etc/hosts file.
I have also checked for the port availability using netstat, but these all seems to be correct. Can anybody help?

did you get a solution? I have the same issue and none of the answers here work — Karmah24, Feb 02 '21 at 14:46
Actually in my case I was getting this issue because of wrong url e.g. I was using `/api/note//` instead of `/api/notes//` — Nikhil Bhardwaj, Jan 04 '22 at 14:13

score 60 · Answer 1 · edited May 16 '23 at 13:37

60

I had a same problem in my React App and I fixed it by just adding / after the port number in package.json file (so now it's: "proxy": http://localhost:5000/)

edited May 16 '23 at 13:37

Tamir Abutbul

7,301
7
25
53

answered Aug 17 '19 at 00:36

Dennis

751
6
9

6

Don't think this would work because this only fixes if the user is not adding a slash when using the route in the frontend. Adding the slash just makes it so you do not need to add that beginning slash in any of your routes in your react app – Michael Torres Oct 23 '21 at 08:42
1

for me removing the '/' solved the issue – Isaac Cohen Sep 07 '22 at 10:21
It worked temporarily. Same problem again after a fresh npm start. – Saurabh Mahra May 25 '23 at 04:36

score 38 · Answer 2 · answered Aug 20 '18 at 07:43

38

I faced a similar issue but in Mac machine. I changed localhost to 127.0.0.1 and that worked for me.

For windows:

"proxy": {
  "/auth/google": {
    "target": "localhost:5000"
  }
}

For Mac:

"proxy": {
  "/auth/google": {
    "target": "http://127.0.0.1:5000"
  }
}

answered Aug 20 '18 at 07:43

Ankit Chaurasia

785
7
7

it worked, no idea why. On curl they are both solved... – Jacopofar Jan 24 '22 at 16:39
Didn't work for me on mac. – Mohammad Arif Apr 30 '22 at 10:11
I confirm that using localhost as a proxy host is a problem on Mac. Using 127.0.0.1 fixed the issue for me. – Tim Oct 28 '22 at 15:55
Yes, this works for me. I have a Mac and changing to `127.0.0.1` fixed it. Could anyone explain this in detail? Would love to know. – Vikram Aug 03 '23 at 21:11

score 20 · Answer 3 · edited Jul 07 '22 at 01:32

20

In your server package.json add --ignore client to your "start" or "server" scripts. So it would look like this:

 "scripts": {
 "start": "node index.js",
 "server": "nodemon index.js --ignore client"
 }

edited Jul 07 '22 at 01:32

Montaro

9,240
6
29
30

answered Oct 04 '17 at 21:57

Ega

437
4
12

1

Thank you so much for this. I was trying to fix this bug for hours. – Simone Anthony Jul 18 '21 at 06:32
1

How did you know to do this? – Simone Anthony Jul 18 '21 at 06:47
1

Hi, I don’t exactly remember how I figured it out, since it was quite a while ago. But I do remember narrowing the problem down to nodemon and looking through the internet to find configurations and picking the most logical ones to test. I hope that answers your thought process question. Most importantly I believe it was knowing what to ask that led me to an acceptable solution. – Ega Jul 20 '21 at 05:18
Lifesaver! This flag works with react-scripts as well: `react-scripts start --ignore client` – Mattwmaster58 Feb 09 '23 at 06:18

score 15 · Answer 4 · edited Aug 22 '22 at 01:09

In server directory

npm install --save http-proxy-middleware

then create a file with this name : setupProxy.js in src directory of client react folder

then add the following

const proxy = require("http-proxy-middleware");
module.exports = function(app) {
  app.use(proxy("/api/**", { // https://github.com/chimurai/http-proxy-middleware
    target: "http://localhost:5000",
    secure: false
  }));
};

In proxy configuration make sure you are matching any path with double ** not only *

Note: you are not going to require this proxy anywhere else just like that

Note: remove any other proxy settings in package.json For more check this reference

Note: You do not need to import this file anywhere. It is automatically registered when you start the development server. — Syed Ali Shahzil, Mar 19 '21 at 07:15

score 15 · Answer 5 · answered Sep 10 '20 at 13:23

15

I think You have not start your Back end server. Try start both Back end and Front end server concurrently. Just simply run npm start in both back end and front end.

answered Sep 10 '20 at 13:23

Geo Tech

307
3
11

score 6 · Answer 6 · answered Apr 24 '20 at 16:18

6

In your node module include

{
...
  "proxy": "http://127.0.0.1:5000"
}

Where the ... simply means you should append the proxy ip to it.

Also, if you are using axios, doing axios.post('api/users') works and not axios.post('/api/users')

answered Apr 24 '20 at 16:18

Nkoro Joseph Ahamefula

526
3
11

I am using fetch so should I use '/ ' or not – Sachin Jun 11 '20 at 14:27

score 5 · Answer 7 · answered Jul 23 '21 at 03:51

5

For those who are using Docker, if your docker-compose.yml looks like:

services:
  app:
    ...
    depends_on:
      - api
    ports:
      - 3000:xxxx
    ...
  api:
    ...
    ports:
      - 5000:xxxx
    ...

Then we should set the proxy URL to

  "proxy": "http://host.docker.internal:5000"

answered Jul 23 '21 at 03:51

Devo

1,004
11
10

Very good...but one question, will this also work when you deploy the stuff? – Front-end Developer Nov 23 '21 at 23:47
@Front-endDeveloper As stated in the doc https://create-react-app.dev/docs/proxying-api-requests-in-development/, "proxy" is only available in the development environment. – Devo Nov 24 '21 at 11:01

score 5 · Answer 8 · answered Dec 27 '21 at 13:21

5

In package.json file just add "/" after the port number and it should work fine.

"proxy": "http://localhost:5000/"

answered Dec 27 '21 at 13:21

Piyush Chandra

159
1
4

score 3 · Answer 9 · answered Feb 09 '18 at 15:08

3

I have similar issue. The problem was that server was listening on ipv6 ::1 address and the proxy was connecting to ipv4 127.0.0.1

I changed both addresses from localhost to 127.0.0.1

answered Feb 09 '18 at 15:08

Fantastory

1,891
21
25

score 3 · Answer 10 · answered Sep 12 '19 at 18:48

3

Use "proxy":"http://localhost:PORT_NUMBER/" in package.json

and in axios backend call route like use axios.get("api/user/getinfo") instead of axios.get("/api/user/getinfo");

answered Sep 12 '19 at 18:48

Hrishikesh Baidya

513
4
7

score 3 · Answer 11 · answered Jul 31 '22 at 03:38

None of these answers were helping me despite everyone's effort. Finally, thankfully, I found this github discussion where someone said use node server.js to start the server. This WORKED. Before I was using nodemon server.js and npm start. I've no idea why those commands weren't able to connect to my proxy at http://127.0.0.1:5000 but node server.js could.

Cheers

score 2 · Answer 12 · answered Jan 07 '19 at 04:56

I think Server not working properly, you should run client and server concurrently for that add following procedures in package.json file

1) Install concurrently

npm install concurrently --save

2) configure client and server

"server": "nodemon server.js",
"client": "npm start --prefix client"

3) configure concurrently

"dev": "concurrently "npm run server" "npm run client""

score 2 · Answer 13 · answered Nov 04 '20 at 20:30

2

if you are not using concurrently at your server side then simply run each front-end and back-end separately such that server side should run first and client side last.

answered Nov 04 '20 at 20:30

Matiullah Mosazai

61
3

Thank you! This answer actually helped me. – Shingai Munyuki Aug 28 '21 at 14:58

Harshit Gangwar · Answer 14 · 2022-01-19T04:50:32.497

2

This has something to do with default settings of create-react-app.

I found a solution from Github Issue. Read the response by danielmahon on 15 Mar 2018

"proxy": {
    "/api": {
      "target": "https://localhost:5002",
      "secure": false
    }
  },

edited Jan 19 '22 at 04:50

answered Jan 04 '21 at 04:25

Harshit Gangwar

553
7
14

score 2 · Answer 15 · answered May 26 '21 at 07:54

2

Changing localhost to [::1] solved my problem.

Taken from here https://forum.vuejs.org/t/proxy-error-with-vue-config-js-and-axios/110632/4?u=mahmoodvcs

answered May 26 '21 at 07:54

Mahmood Dehghan

7,761
5
54
71

score 1 · Answer 16 · answered Sep 24 '17 at 17:21

If you can't connect to localhost on port 5000 via telnet (you can download and use PuttY if you don't have telnet installed), then that means that server isn't running.

If you're using a Windows machine, go to your package.json for the server that is running on port 5000 and change this line:

"start": "./node_modules/.bin/concurrently \"./node_modules/.bin/nodemon\" \"npm run client\"",

To this:

"start": "./node_modules/.bin/concurrently \"npm run server\" \"npm run client\"",

Watch your build messages and you should see something similar to the following:

[0]   ==> API Server now listening on PORT 5000!
[1] Starting the development server...
[1]
[1] Compiled successfully!
[1]
[1] You can now view chat app in the browser.
[1]
[1]   Local:            http://localhost:3000/
[1]   On Your Network:  http://192.168.1.118:3000/
[1]
[1] Note that the development build is not optimized.
[1] To create a production build, use yarn build.

score 1 · Answer 17 · answered Nov 26 '19 at 14:27

1

My issue was trying to run my react project with docker containers open.

Change the ports or shut down the containers.

answered Nov 26 '19 at 14:27

user3152459

355
4
12

score 1 · Answer 18 · answered Jun 21 '20 at 11:35

In my case the problem was that I have been accessing the PORT by the wrong name, i had it PORT instead of SERVER_PORT which was my correct environment variable name. So this problem means that there is a something wrong in your code, in my case the port on which the server should be running was undefined.

score 1 · Answer 19 · answered Oct 28 '21 at 03:26

Proxy error: Could not proxy request /signup from localhost:3000 to http://localhost:8282/. See https://nodejs.org/api/errors.html#errors_common_system_errors for more information (ECONNREFUSED).

I got the same issue and I just solved it by only restart both of the server, you need to run both of the server running.

Thanks me ltr:)

score 1 · Answer 20 · edited Mar 26 '23 at 03:29

If you are using axios, using proxy might not work sometimes. To fix that, we need to configure our axios before sending requests. axios has a create() method, which we can use to set the baseURL.

Create a new file http.js in your src folder:

import axios from "axios";

const http = axios.create({
  baseURL: "http://localhost:5000",
  headers: {
    Accept: "application/json",
    "Content-Type": "application/json",
  },
});
export default http;

Now instead of importing from axios, use this:

import axios from "../../http";

score 0 · Answer 21 · answered Oct 08 '22 at 09:17

I recently got this error when waiting for a response from my rest API function which does not return any.

so you either need to change the API implementation and send something back to the client or just don't wait for a response if you are not returning any.

score 0 · Answer 22 · answered Jun 14 '23 at 08:07

For me proxy should go from http://localhost:3000 to https://localhost:3001 . I changed the second one from https to http, so that in my package.json file is written now:

"proxy": "http://localhost:3001",

I am not sure if this is the correct solution as I am taking a more insecure protocol, but it worked for me.

score -1 · Answer 23 · answered Aug 14 '22 at 07:47

In my case, I changed port number from 5000 to 7000, while reactjs was still fetching on localhost 5000, after I changed everything worked perfect

ReactJs FETCH HOOK:

    const { data, loading, error } = useFetch(
    "http://localhost:7000/api/hotels/countByCity?cities=Arusha,Dodoma,Mwanza,Dar-es-salaam"
  );

NodeJS server port:

const PORT = process.env.PORT || 7000;

Could not proxy request /pusher/auth from localhost:3000 to http://localhost:5000 (ECONNREFUSED)

23 Answers23

Linked