CODEWITHSUNDEEP
javascriptreactjsaxios
Rufaida Shafiq
Rufaida Shafiq

Reputation: 103

Error:Request failed with status code 404 at createError (createError.js:16) at settle (settle.js:17) at XMLHttpRequest.handleLoad (xhr.js:62)

This is my App.js file

 import React, { Component } from "react";
import axios from "axios";

export default class App extends Component {
 state = {
  hello: null
    }

 componentDidMount() {
 // API call via local server
  axios.get('/hello')
  .then(res => this.setState({ hello: res.data }))
  .catch(error => console.error(error))
  }

  render() {
  return (
    <div className="App">
   
    {this.state.hello
      ? <div>{this.state.hello}</div>
      : ''}
   </div>
   )
   }
   }

Im connecting my express server through a proxy "proxy": "http://localhost:5000"

I have created sample express project and define it like this

  var express = require('express')

 var router = express.Router()

  router.get('/hello', function (req, res) {
 res.json("hello world")
 })

 module.exports = router

Upvotes: 0

Views: 6524

Answers (1)

Always Learning
Always Learning

Reputation: 5601

You're getting a 404 because your axios call is going to your web app, not port 5000. You need to be more explicit in your axios url like this:

  axios.get('http://localhost:5000/hello')
  .then(res => this.setState({ hello: res.data }))
  .catch(error => console.error(error))
  }

Upvotes: 3

Related Questions