조인한 테이블에서 데이터 꺼내오기 질문
269
작성한 질문수 23
안녕하세요 선생님. 현재 유저 프로필의 이미지를 불러오는데에 어려움을 겪고 있습니다...ㅠ
유저 정보는 유저 리듀서의 info안에 들어있으니 쉽게 꺼냈는데,
유저 Image는 다른 테이블(Images 테이블)에 들어있어서 어떻게 해당 아이디의 image의 src를 꺼내올 수 있는지 모르겠습니다..
<img src={`http://localhost:3065/${me.Images[0].src}`} />
저는 이렇게 가져오면 되지 않을까 싶었는데
me는 useSelector로 가져왔고,
리액트 노드버드에서 게시글 이미지를 조인된 테이블에서 `http://localhost:3065/${images[0].src}`이렇게 가져오길래(노드버드에서는 부모 컴포넌트에서 부터 props로 전달해서 준 것을 알지만 맥락이 제 코드와 비슷하다고 생각했습니다.)
하지만 리액트 노드버드에서는 게시글 이미지를 불러올 때 map의 키값으로 각각의 post의 id를 알 수 있지만 저는 바로 me를 불러오는데...어떻게 해야할지 감을 잡을 수 없어 질문 드립니다.ㅠ
조언 부탁드립니다 선생님.
답변 1
0
me 정보를 서버에서 불러올 때 Images를 include 안 하신 게 아닌가요??
0
네....선생님 말씀대로 include에서 이미지 테이블을 빼먹었습니다....ㅠㅠㅠㅠㅠ제가 놓친 부분 이네요...
그리고 이상하게 이전 질문에서 routes의 user의 add.Image에서 오류가 나서, 선생님이 create부분에서 UserId를 설정하라 하셔서 설정해가지고 그 부분 오류는 해결했었는데 갑자기 또 add.Image가 함수가 아니라고 오류가 납니다..UserId를 설정했는데도요.
//프로필 정보 수정
router.patch('/info', isLoggedIn, upload.none(), async(req, res, next) => {
try{
const user = await User.update({
info: req.body.info
}, {
where: {
id: req.user.id
}
});
if(req.body.image){
console.log('image:::' + req.body.image);
console.log('user:::' + req.user.id);
const image = await Image.create({src: req.body.image, UserId: req.user.id});
await user.addImage(image);
}
res.status(200).json({info: req.body.info});
}
catch(error){
console.error(error);
next(error);
}
});오류가 난 부분은 이렇고,
Images테이블 구성은
위와 같이 되어있습니다.
콘솔의 에러 코드를 보면
Executing (default): SELECT id, nickname, password, info, createdAt, updatedAt FROM Users AS User WHERE User.`id` = 1;
Executing (default): UPDATE Users SET info=?,`updatedAt`=? WHERE id = ?
image:::luobulinka-FO4mQZi1c0M-unsplash_1667562741275.jpg
user:::1
Executing (default): INSERT INTO Images (`id`,`src`,`createdAt`,`updatedAt`,`UserId`) VALUES (DEFAULT,?,?,?,?);
TypeError: user.addImage is not a function
at C:\Users\내컴\Desktop\passionary\back\routes\user.js:161:22
at processTicksAndRejections (node:internal/process/task_queues:96:5)
TypeError: user.addImage is not a function
at C:\Users\내컴\Desktop\passionary\back\routes\user.js:161:22
at processTicksAndRejections (node:internal/process/task_queues:96:5)
PATCH /user/info 500 35.501 ms - 338
라고 하는데
console.log를 찍어본걸 보면 브라우저에서 요청한 image데이터도 들어오고, user id도 들어와 있는데 왜 addImage함수가 다시 작동을 안하는지 모르겠습니다.....
user와 image의 모델 관계는 user에
db.User.hasOne(db.Image);image에
db.Image.belongsTo(db.User);로 설정해놨습니다.
조언 부탁드립니다 선생님.
넥스트 버젼 질문
0
90
2
로그인시 401 Unauthorized 오류가 뜹니다
0
104
1
무한 스크롤 중 스크롤 튐 현상
0
197
1
특정 페이지 접근을 막고 싶을 때
0
116
2
createGlobalStyle의 위치와 영향범위
0
103
2
인라인 스타일 리렌더링 관련
0
98
2
vsc 에서 npm init 설치시 오류
0
159
2
nextjs 15버전 사용 가능할까요?
0
166
1
화면 새로고침 문의
0
129
1
RTK에서 draft, state 차이가 있나요?
0
164
2
Next 14 사용해도 될까요?
0
455
1
next, node 버전 / 폴더 구조 질문 드립니다.
0
359
1
url 오류 질문있습니다
0
218
1
ssh xxxxx로 우분투에 들어가려니까 port 22: Connection timed out
0
391
1
sudo certbot --nginx 에러
0
1295
2
Minified React error 콘솔에러 (hydrate)
0
481
1
카카오 공유했을 때 이전에 작성했던 글이 나오는 버그
0
257
1
프론트서버 배포 후 EADDRINUSE에러 발생
0
341
1
npm run build 에러
0
526
1
front 서버 npm run build 중에 발생한 에러들
0
399
1
서버 실행하고 브라우저로 들어갔을때 404에러
0
351
2
css 서버사이드 랜더링이 적용되지 않아서 문의 드립니다.
0
291
1
팔로워 3명씩 불러오고 데이터 합쳐주는걸로 바꾸고 서버요청을 무한으로하고있습니다.
0
250
2
해시태그 검색에서 throttle에 관해 질문있습니다.
0
207
1





