'"Cannot get" when I do API request with React and Axios
I use React and Axios for API requests.
I have a problem with an API request; I get:
Cannot GET /posts/byId/1
When I do a GET at http://localhost:3002/posts/byId/1, while all my other requests work.
Does anyone have a solution?
My Routes :
const express = require('express');
const router = express.Router();
const { Posts } = require('../models');
router.get('/', async (req, res) => {
const listOfPosts = await Posts.findAll();
res.json(listOfPosts);
});
router.get('/byId/:id', async (req, res) => {
const id = req.params.id;
const post = await Posts.findByPk(id);
res.json(post);
});
router.post('/', async (req, res) => {
const post = req.body;
await Posts.create(post);
res.json(post);
});
module.exports = router;
My App.js :
import './App.css';
import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
import Home from './pages/Home';
import CreatePost from './pages/CreatePost';
import Post from './pages/Post';
function App() {
return (
<div className="App">
<Router>
<div className="navbar">
<Link to="createPost"> Create A Post </Link>
<Link to="/"> Home Page </Link>
</div>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/createPost" element={<CreatePost />} />
<Route path="/post/:id" element={<Post />} />
</Routes>
</Router>
</div>
);
}
export default App;
My Post.js :
import React, { useEffect } from 'react';
import { useParams } from 'react-router-dom';
import axios from 'axios';
function Post() {
let { id } = useParams();
useEffect(() => {
axios.get(`http://localhost:3002/posts/byId/${id}`).then((response) => {});
});
return <div>{id}</div>;
}
export default Post;
Solution 1:[1]
Update: I had to uninstall and install nodeJS(node_modules) and that solved the problem
Solution 2:[2]
Your route isn't /posts/byId/:id, but rather just /byId/:id
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | kevin.eth |
| Solution 2 | batman567 |
