axios 요청 시 y 파라미터가 빈 값인 경우 에러가 발생합니다

Question

안녕하세요. 강의 잘 듣고 있습니다. store/movie.js에서 axios.get를 사용해 api request 시에 y파라미터 값으로 year를 전달하게 되는데요.(강의 6:40 ~ 부분) Search 컴포넌트에서 All years 옵션 선택 시 빈 스트링 값인 ""이 value로 전달되고, &y=""로 요청이 되게 되는데 OMDb API가 변경되었는지 해당 요청에 대해 401 에러를 반환합니다.(이유는 모르겠지만 API Key가 정상임에도 에러 메시지가 Invalid API Key Error네요.) const res = await axios.get(`https://www.omdbapi.com/?apikey=${OMDB_API_KEY}&s=${title}&type=${type}${year ? `&y=${year}`: ""}`) 위와 같이 year 값이 존재하는 경우에만 y파라미터를 사용하도록 변경하니 잘 작동하는데요. 원인이 정확하지 않아 확인 차 여쭤봅니다. 그리고 위와 같이 값 존재 여부에 따라 파라미터를 선택적으로 넘겨주고 싶을 때 저렇게 코딩하는게 맞나요...?(좀 더 좋은 방식이 있는지 궁금합니다)

HEROPY · Answer

이인우 님 안녕하세요~😊 우선 401 에러는 인증 오류이기 때문에, API 키 등에 문제가 있었던 것으로 추측되네요. y 파라미터와는 직접 관련은 없어 보이고요. 혹시나 해서 요청 테스트를 해봤는데, OMDbAPI에 변경사항이 있진 않습니다. 그리고 y 파라미터에 문제가 발생하면 완성 코드를 기준으로는 400 에러를 반환하게 설계했기 때문에, 아무래도 y 파라미터의 코드 수정 과정에서 특정 문제가 같이 수정된 것은 아닌가 추측합니다. 만약 현재 작성하신(잘 동작하는) 코드에서 y 파라미터만 원래 강의 내용처럼 돌려놓았을 때 역시 에러가 반환된다면, 그대로 코드를 깃헙 저장소에 업로드하고 링크 보내주시면 확실하게 문제를 진단하고 설명을 드리겠습니다! 그럼 확인 부탁드리고, 즐거운 주말 보내세요~👍