1

I have hosted frontend on Azure and backend on Heroku. When I am calling an API then proxy is not working. I have tried multiple times but it's not working.

I have create frontend on react.js and backend on node.js and database is MongoDB.

package.json: 

  {
    "name": "yoke",
    "version": "0.1.0",
    "private": true,
    "dependencies": {
      "axios": "^0.18.0",
      "bootstrap": "^4.3.1",
      "config": "^3.1.0",
      "history": "^4.9.0",
      "jquery": "^3.4.1",
      "jwt-decode": "^2.2.0",
      "moment": "^2.24.0",
      "popper.js": "^1.15.0",
      "react": "^16.8.6",
      "react-bootstrap": "^1.0.0-beta.8",
      "react-dom": "^16.8.6",
      "react-router-dom": "^5.0.0",
      "react-scripts": "3.0.1",
      "serve": "^11.0.2"
    },
    "proxy": "https://fierce-reef-74150.herokuapp.com",
    "scripts": {
      "start": "react-scripts start",
      "build": "react-scripts build",
      "test": "react-scripts test",
      "eject": "react-scripts eject"
    },
    "eslintConfig": {
      "extends": "react-app"
    },
    "homepage": "http://www.sanganan.com/",
    "browserslist": {
      "production": [
        ">0.2%",
        "not dead",
        "not op_mini all"
      ],
      "development": [
        "last 1 chrome version",
        "last 1 firefox version",
        "last 1 safari version"
      ]
    }
  }

and my API calling code is : 

  export const login = user => {
    return axios
      .post("/newlogin", {
        phone: user.phone,
        pass: user.password
      })
      .then(res => {
        localStorage.setItem("usertoken", res.data);
        return res.data;
      })
      .catch(err => {
        console.log(err);
      });
  };

My proxy defined in package.json file should work but its not working. I am getting this error. 

Error: Request failed with status code 404
    at e.exports (createError.js:17)
    at e.exports (settle.js:19)
    at XMLHttpRequest.d.onreadystatechange (xhr.js:60)
Anurag Mishra
  • 647
  • 3
  • 15
  • 31
  • Just add `run-p` before the `scripts` -> `start` command - https://www.twilio.com/blog/react-app-with-node-js-server-proxy – ravibagul91 Jun 24 '19 at 05:48
  • Look at right answer on [this](https://stackoverflow.com/questions/52845805/deploying-create-react-app-to-heroku-with-express-backend-returns-invalid-host-h) question, it worked for me – Catarina Oct 09 '19 at 10:32

0 Answers0