28

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?

tso
  • 4,174
  • 2
  • 17
  • 30
Maanu
  • 387
  • 1
  • 3
  • 10

15 Answers15

15

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/")

Dennis
  • 193
  • 2
  • 8
10

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

enter image description here

then add the following

enter image description here

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

Ahmed Younes
  • 494
  • 5
  • 12
  • 1
    Note: You do not need to import this file anywhere. It is automatically registered when you start the development server. – Ali Shahzil Mar 19 '21 at 07:15
8

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"
  }
}
Ankit Chaurasia
  • 435
  • 5
  • 6
6

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"
 }
Ega
  • 85
  • 1
  • 7
2

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')

Nkoro Joseph Ahamefula
  • 392
  • 1
  • 9
1

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.

Geo Tech
  • 59
  • 7
0

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.
sherman.gore
  • 1
  • 2
0

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

fantastory
  • 1,646
  • 19
  • 22
0

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""
KARTHIKEYAN.A
  • 11,752
  • 4
  • 81
  • 93
0

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");

Hrishikesh Baidya
  • 161
  • 4
0

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

Change the ports or shut down the containers.

user3152459
  • 91
  • 2
  • 8
0

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.

Muhamed Krasniqi
  • 785
  • 1
  • 8
  • 13
0

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.

Matiullah Mosazai
  • 1
  • 2
0

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

Mahmood Dehghan
  • 6,493
  • 4
  • 52
  • 65
-1

Thi 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
    }
  },
Harshit Gangwar
  • 160
  • 2
  • 9