인프런 커뮤니티 질문&답변

서나현님의 프로필 이미지

작성한 질문수

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

포트폴리오 리뷰

이미지 업로드 url 오류 입니다.

24.07.16 15:15 작성

·

98

0

freeboard_frontend 이미지 업로드 부분 진행중인데 upload 버튼 클릭해서 이미지를 선택하면
Cannot destructure property 'url' of 'undefined' as it is undefined.
이라는 안내창이 뜨면서 정상적으로 실행이 되지 않습니다.. 원인을 알 수 있을까요?

다른 분 문의 글을 보고 혹시 apollo셋팅 문제인가 싶어
yarn add apollo-upload-client 와 yarn add -D @types/apollo-upload-client 를 추가로 설치 해봤는데도 문제 해결이 안됩니다..

답변 1

0

인프런 AI 인턴님의 프로필 이미지

2024. 07. 18. 15:21

안녕하세요, 인프런 AI 인턴입니다.

서나현님, 이미지 업로드 중 발생한 오류와 관련하여 설명드릴게요.

Cannot destructure property 'url' of 'undefined' as it is undefined. 오류는 업로드를 시도하는 이미지 객체 내에서 url 속성을 찾을 수 없을 때 발생합니다. Apollo 클라이언트 설정과는 별개의 문제로 보입니다. 이미지 업로드 로직에서 응답 받는 객체 구조를 정확하게 파악하지 못하는 경우에 이런 오류 메시지가 출력되는 경우가 많습니다.

이미지 업로드 로직에서 반환 받는 응답 객체의 구조를 확인해 보세요. 예를 들어, 서버에서 이미지 업로드 후 응답으로 이미지 URL을 담은 객체를 반환하는 경우, 해당 객체가 정상적으로 반환되고 있는지, 그리고 그 객체 내의 url 속성에 접근하기 전에 해당 객체가 undefined인지 아닌지 먼저 확인하는 로직이 필요합니다.

또한, Apollo Upload Client 설정이 정확한지, 그리고 이미지를 업로드하는 GraphQL Mutation이 올바르게 구성되었는지도 확인해 보시기 바랍니다. 이미지 업로드를 위한 Apollo 클라이언트의 설정이나 사용하는 GraphQL Mutation의 예시 코드를 검향하여 문제가 없는지 점검해보세요.

혹시나 문제가 여전히 해결되지 않는다면, 이미지 업로드를 처리하는 백엔드 로직과 프론트엔드에서의 요청 로직을 재검토해보는 것이 좋습니다. 구체적인 코드를 보지 못해 정확한 해결 방안을 제시하기는 어려우나, 제시한 방향으로 문제를 접근해 보시기 바랍니다.

도움이 되었기를 바랍니다. 추가적인 질문이 있으시다면 언제든지 문의해주세요.