2024. 8. 7. 23:24ㆍTEAM-PROJECT/IMAD-WEB
오랜만의 포스팅이지만...
길게 적을 것은 아니고 개발도중 어이없던 에러가 하나 생겨나 짧게 포스팅을 해볼까 한다.
프로필 페이지를 개발하던 도중 분명히
로컬 테스트 환경에선 잘만 나오던 성별아이콘이 빌드 이후
EC2에서 배포 중에는 이미지를 불러오지 않는 버그가 터진 것이다.
ㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠ
간단하지만 로직을 보여주자면
아이콘으로 사용할 사진의 이름을 FEMALE과 MALE이라는 대문자. png로 저장을 하였다.
굳이 대문자로 저장되어 있는 이유는
보시다시피 우리 백엔드 서버가 로그인한 유저의 성별정보를 보내줄 때 이렇게 대문자문자열로 성별을 보내 주기 때문이다.
따라서
나는 따로 if 로직을 추가할 필요 없이 src를 설정하는 부분에서 링크에서 성별 부분을 데이터 통신으로 받아와
MALE.png 또는 FEMALE.png로 가져올 수 있도록 로직을 구성하였다.
하지만
배포된 EC2 홈페이지에서 통신을 시도하면 이렇게 통신 오류가 뜬것을 확인할 수 있었다.
데이터를 불러오기 전에 렌더링 되어 undefined.png 가 실패한 건 이해가 가능해도
MALE.png 통신이 실패한 걸 보고 의아했었다.
분명히 나는 빌드파일을 올릴 때도 대문자로 수정된 MALE.png , FEMALE.png 파일로 빌드를 시작했고
정상적으로 빌드도 끝났기 때문이다.
그래서 혹시나 대소문자를 다시 변경하면 적용이 될까 해서 대문자로 다시 변경한 후 커밋을 시도하려고 하였지만
??????????
대소문자를 변경한 걸로는 auto 커밋에 파일변경이 잡히지 않는 걸 확인했다...
아이콘 파일을 삭제도 해보니 대문자이름파일이 아닌 기존 맨 처음 아이콘 파일 커밋에 적용되었던
이름인 소문자이름파일들이 삭제된 것을 확인했다.
적어도 동일한 스펠링 대소문자변경은 auto커밋 파일 대상에서 제외되는 듯했다...
그래서 다소 무식하지만 간단한 방법으로 기존 아이콘 사진을 삭제하고 윈도에서 파일이름을 대문자로 변경해 새로 아이콘 파일을 커밋 시도하였다.
이번엔 기존에 삭제되었던 파일이 다시 디렉터리에 들어오는 것이기에 auto 커밋에 잡혀 정상적으로 커밋되는 것을 확인하였다.
이후 빌드를 진행하고 보니 기존 테스트환경처럼 아이콘이 잘 나오는 모습이다 ^^
매우 간단하고 어이없던 버그였지만 혹시라도 나중에 다시 헷갈리는 날이 올까 하여 포스팅을 올려본다..
'TEAM-PROJECT > IMAD-WEB' 카테고리의 다른 글
작품검색의 로직변경! 실시간 반영 검색기능 구현하기! (0) | 2024.04.20 |
---|---|
#3 소셜 로그인 구현 (1) | 2024.02.25 |
#2 CI/CD AWS REACT NEXT.JS 배포 자동화 구축하기! (1) | 2023.12.20 |
#1 팀 프로젝트 시작! 로그인/회원 조회 API 테스트 (REACT) (0) | 2023.11.30 |