Welcome to Software Development on Codidact!
Will you help us build our independent community of developers helping developers? We're small and trying to grow. We welcome questions about all aspects of software development, from design to code to QA and more. Got questions? Got answers? Got code you'd like someone to review? Please join us.
Axios error bad request [closed]
Closed as unclear by Alexei on Oct 30, 2023 at 18:58
This question cannot be answered in its current form, because critical information is missing.
This question was closed; new answers can no longer be added. Users with the reopen privilege may vote to reopen this question if it has been improved or closed incorrectly.
I'm trying to use this code with Axios:
import "./feed.css";
import Post from "../post/Post";
import Share from "../share/Share";
import { useState, useEffect } from "react";
import axios from "axios";
export default function Feed() {
const [posts, setPosts] = useState([]);
useEffect(() => {
const fetchPosts = async () => {
const res = await axios.get("posts/timeline/6538df8177465068b3aba917");
setPosts(res.data);
};
fetchPosts();
}, []);
return (
<div className="feed">
<div className="feedWrapper">
<Share />
{posts.map((p) => (
<Post key={p._id} post={p} />
))}
</div>
</div>
);
}
But I see 404 errors in the terminal managing the API:
Backend Server is running
Database Connected
::1 - - [26/Oct/2023:06:24:13 +0000] "GET /api/profile/posts/timeline/6538df8177465068b3aba917 HTTP/1.1" 404 190
::1 - - [26/Oct/2023:06:24:13 +0000] "GET /api/profile/posts/timeline/6538df8177465068b3aba917 HTTP/1.1" 404 190
and I get errors in the browser console:
xhr.js:256
GET http://localhost:3000/profile/posts/timeline/6538df8177465068b3aba917 404 (Not Found)
dispatchXhrRequest @ xhr.js:256
xhr @ xhr.js:49
dispatchRequest @ dispatchRequest.js:51
request @ Axios.js:146
Axios. @ Axios.js:172
wrap @ bind.js:5
fetchPosts @ Feed.jsx:12
(anonymous) @ Feed.jsx:15
commitHookEffectListMount @ react-dom.development.js:23150
commitPassiveMountOnFiber @ react-dom.development.js:24926
commitPassiveMountEffects_complete @ react-dom.development.js:24891
commitPassiveMountEffects_begin @ react-dom.development.js:24878
commitPassiveMountEffects @ react-dom.development.js:24866
flushPassiveEffectsImpl @ react-dom.development.js:27039
flushPassiveEffects @ react-dom.development.js:26984
(anonymous) @ react-dom.development.js:26769
workLoop @ scheduler.development.js:266
flushWork @ scheduler.development.js:239
performWorkUntilDeadline @ scheduler.development.js:533
Feed.jsx:14 Uncaught (in promise) AxiosError {message: 'Request failed > with status code 404', name: 'AxiosError', code: 'ERR_BAD_REQUEST',
config: {…}, request: XMLHttpRequest, …}
fetchPosts @ Feed.jsx:14
await in fetchPosts (async)
(anonymous) @ Feed.jsx:15
commitHookEffectListMount @ react-dom.development.js:23150
commitPassiveMountOnFiber @ react-dom.development.js:24926
commitPassiveMountEffects_complete @ react-dom.development.js:24891
commitPassiveMountEffects_begin @ react-dom.development.js:24878
commitPassiveMountEffects @ react-dom.development.js:24866
flushPassiveEffectsImpl @ react-dom.development.js:27039
flushPassiveEffects @ react-dom.development.js:26984
(anonymous) @ react-dom.development.js:26769
workLoop @ scheduler.development.js:266
flushWork @ scheduler.development.js:239
performWorkUntilDeadline @ scheduler.development.js:533
xhr.js:256
GET http://localhost:3000/profile/posts/timeline/6538df8177465068b3aba917
404 (Not Found)
dispatchXhrRequest @ xhr.js:256
xhr @ xhr.js:49
dispatchRequest @ dispatchRequest.js:51
request @ Axios.js:146
Axios. @ Axios.js:172
wrap @ bind.js:5
fetchPosts @ Feed.jsx:12
(anonymous) @ Feed.jsx:15
commitHookEffectListMount @ react-dom.development.js:23150
invokePassiveEffectMountInDEV @ react-dom.development.js:25154
invokeEffectsInDev @ react-dom.development.js:27351
commitDoubleInvokeEffectsInDEV @ react-dom.development.js:27330
flushPassiveEffectsImpl @ react-dom.development.js:27056
flushPassiveEffects @ react-dom.development.js:26984
(anonymous) @ react-dom.development.js:26769
workLoop @ scheduler.development.js:266
flushWork @ scheduler.development.js:239
performWorkUntilDeadline @ scheduler.development.js:533
Feed.jsx:14 Uncaught (in promise) AxiosError {message: 'Request failed with status code 404', name: 'AxiosError', code: 'ERR_BAD_REQUEST', config: {…}, request: XMLHttpRequest, …}
What is wrong, and how do I fix it?
1 comment thread