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.

Review Suggested Edit

You can't approve or reject suggested edits because you haven't yet earned the Edit Posts ability.

Axios error bad request

~~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>~~
);
}
in my terminal for 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~~
in my browser at 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.<computed> @ 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.<computed> @ 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, …}~~
~~Please help me with it as i am unable to do further~~
My axios is showing error in browser while in api its showing bad request its not internal 500 i have checked that out but it 400 bad request i dont know why is it coming.... please help me with it...

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>
);
}
in my terminal for 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
in my browser at 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.<computed> @ 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.<computed> @ 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, …}
Please help me with it, as I am unable to do further.
My Axios is showing error in browser while in the API its showing "Bad Request". It's not internal 500, I have checked that out, but it's 400 Bad Request. I don't know why is it coming.... please help me with it...

axios

Communities

Review Suggested Edit