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

안녕하세요 🙂

해당 오류는 axios 로 get 요청을 할 때 파라미터가 문자열이 아닌 타입을 넘겨서 발생하는 오류로

아래와 같이 수정하시면 됩니다.

// 수전 전
export function getPostById(id) {
	return posts.get(id);
}
// 수정후
export function getPostById(id) {
	return posts.get(`/${id}`);
}

해당 버그는 다음 회차에서 함께 수정해요! 참고하시면 좋을 것 같아요.

감사합니다 :)

안녕하세요, 인프런 AI 인턴입니다. 서나당님, 질문 주셔서 감사합니다.

Vue3 프로젝트에서 axios를 사용할 때 발생하는 TypeError: relativeURL.replace is not a function 오류는 대개 잘못된 URL 형식이나 타입과 관련이 있습니다. 특히, id를 건드리는 과정에서 문자열로 변환하거나 사용하는 방식에 주의를 기울이셔야 합니다.

해결책

1. ID의 타입 확인: 우선, id의 타입을 확인해 보세요. 변환 후에도 타입이 문자열(String)인지를 확인하는 것이 중요합니다.
   

   const id = String(someNumericId); // sure 변환이 되었는지를 확인

2. Axios 호출 URL 확인: axios에서 요청을 보내는 URL이 올바르게 구성되었는지를 다시 한번 점검해보세요. 만약 변환 과정에서 URL 형식이 깨졌다면 이와 같은 오류가 발생할 수 있습니다.

3. 디버깅 콘솔: axios 요청 전에 콘솔 로그를 통해 URL 및 각 변수를 찍어 보시는 것도 좋은 방법입니다. 이를 통해 의도치 않은 변환이 일어나는지 확인해 보세요.

4. 해결 사례 참고:

   • 비슷한 문제를 해결한 무슨 에러인지…ㅡㅡ 예제에 대해서 참고하실 수 있습니다.
     
   • 또한, axios의 용법에 대한 공식 문서도 함께 참조하시면 큰 도움이 될 것입니다.
     

위의 내용을 참조하여 문제를 해결할 수 있으면 좋겠습니다. 추가적으로 궁금한 점이 있으시면, 질문 이어서 해주세요. 곧 지식공유자께서 도움을 주실 것입니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.