"Validation failed (numeric string is expected)" 400 에러와 함께 유저 프로필 / 게시글을 불러오지 못합니다
해당 오류와 함께 유저 프로필 페이지 접속시 게시글을 불러오지 못합니다...!!
콘솔창에서는 해당 메시지와 함께 오류가 출력되는데 맨 밑에 d는 UserPosts.tsx 컴포넌트에서 찍어본 useQuery로 패칭한 데이터 찍어본것 입니다.
getUserPosts.ts에서 받아온 res 값을 콘솔에 찍어봤습니다
제로초님 코드와 동일한데 어떤 이유에선지 유저 프로필 페이지 게시글을 못불러오는지 잘 모르겠어서 낑낑대다가 질문 드렸습니다...ㅠㅠ 감사합니다
답변 1
0
코드를 보여주셔야 합니다. 그리고 지금 어떤 강의를 듣고계셨는지도요. msw서버인지 실서버인지...
에러 자체는 fetch에서 input 잘못넣었다는 에러입니다.
0
넵 섹션 4 답글과 재게시글 꾸미기 강의쯤 듣고 있었습니다. 실서버 사용중이구요
getUserPosts.ts 코드입니다
import { Post } from "@/model/Post";
import { QueryFunction } from "@tanstack/react-query";
export const getUserPosts: QueryFunction<Post[], [_1: string, _2: string, string]>
= async ({ queryKey }) => {
const [_1, _2, username] = queryKey;
const res = await fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/api/users/${username}/posts`, {
next: {
tags: ['posts', 'users', username],
},
credentials: 'include',
cache: 'no-store'
});
console.log("Res",res)
if (!res.ok) {
// This will activate the closest `error.js` Error Boundary
throw new Error('Failed to fetch data')
}
return res.json();
}
0
[username]/_component/UserPost 컴포넌트 코드입니다
'use client';
import { useQuery, useQueryClient } from '@tanstack/react-query';
import { getUserPosts } from '../_lib/getUserPosts';
import Post from '@/app/(afterLogin)/_component/Post';
import { Post as IPost } from '@/model/Post';
export default function UserPosts({ username }: { username: string }) {
const { data } = useQuery<IPost[], Object, IPost[], [_1: string, _2: string, _3: string]>({
queryKey: ['posts', 'users', username],
queryFn: getUserPosts,
staleTime: 60 * 1000,
gcTime: 300 * 1000,
});
const queryClient = useQueryClient();
const user = queryClient.getQueryData(['users', username]);
if (user) {
return data?.map((post) => <Post key={post.postId} post={post} />);
}
return null;
}
이 이미지의 headers 부분도 보여주세요.
0
넵 200 코드와 함께 데이터 잘들어오는거 확인했습니다...!!
일단 데이터가 10개만 들어오니 무한 스크롤 구현은 숙제로 내주신거라고 생각하고 진행해보겠습니다
빠른 대응 감사합니다
캡처링부분 질문있습니다.
0
74
2
깃에 소스코드를 찾을 수 없습니다.
0
113
2
useInfiniteQuery promise와 react use 사용시 페이지 무한 로딩
0
98
1
import 파일 경로를 찾지 못 해서 에러가 발생합니다.
0
109
2
css 라이브러리 추천 부탁드립니다
0
140
2
팔로우 추천 목록이 빈 배열로 들어옵니다.
0
130
1
게시물 업로드 시 userId가 undefined로 들어가는 오류
0
119
1
useSuspenseQuery 사용 시 SSR 401 이슈 관련
0
171
1
리액트 쿼리 useinfinitequery 무한스크롤 구현 시 페이지가 이동할 경우 데이터가 보존되게 할 수 있나요??
0
184
3
폴링이 필요없는 이유
0
93
2
next Request Memoization과 react cache
0
108
2
seo 최적화 기준은 데이터 fetching인가요 아님 데이터 렌더링인가요?
0
84
2
next.js 서버fetch 에러 fallback ui 구현 방법
0
173
2
프레임워크 여론 파악법
0
125
2
필터옵션이 많은 페이지에서 서버 fetch를 하는게 맞는걸까요??
0
103
2
서버 fetch suspense 로 감싸고 새로고침 시 잠시 빈 화면이 노출된 후 fallback ui가 노출됩니다.
0
102
2
template.tsx 내 서버fetch 응답값과 클라이언트 컴포넌트 상태값 싱크가 맞지 않는 이슈
0
66
2
Auth.js 사용 시 authorize 함수가 호출되지 않습니다
0
131
2
next.js 에서 로그인에 관하여
0
138
1
Next의 route handler에 대한 질문이 있습니다.
0
101
2
게시판 리스트 만들때 use client를 어디서부터 집어넣어야할지 모르겠습니다
0
98
2
프라이빗 폴더를 해야 하는 이유가 모호한 것 같아요.
0
85
2
vanilla-extract 못찾는 문제
0
230
2
fetch 캐싱과 revalidate 관련
0
84
2