코딩일지/TIL: Today I Learned

20221227 TIL

야언 2022. 12. 27. 16:03

오늘의 한 일 

  • 최종 프로젝트 - 마무리 및 발표준비

 

 

트러블 슈팅

 

프로필 - 이미지 파일이 없을 시 default.jpeg를 띄우지 못하는 문제

 

프로필의 디폴트 이미지가 원래 백엔드 media/profile 폴더 안에 default.jpeg를 넣어서 띄웠는데, 배포시에 media를 .gitignore로 무시하다보니 생긴 문제.

 

경로는 잘 받아오는데 파일이 없다!

일단 배포중인 ec2 환경 안으로 이미지 파일을 보내야 할 것인데.. 웹개발강의때 하던 파일질라를 이용하는 방법은 지금 사용하기엔 무리라고 판단,

cloud 9을 사용한 파일관리도 이미 있는 인스턴스에 적용하는게 아니라 이걸 쓰려면 생성할때부터 써야하는거같다..

 

그래서 ec2환경에 명령어로 파일 업로드를 시도해봄

 

참조 : https://velog.io/@_koiil/EC2%EB%A1%9C-%ED%8C%8C%EC%9D%BC-%EC%97%85%EB%8B%A4%EC%9A%B4%EB%A1%9C%EB%93%9C

 

EC2로 파일 업/다운로드

업로드 하고 싶은 파일이 있는 경우 아래의 명령어를 입력합니다.ex)EC2인스턴스에서 다운로드 해야 할 파일이 있을 경우 반대로 수행하면 됩니다.ex)

velog.io

저번 TIL때도 썼던거같은데 서버 관리중인 팀원분이 아직 해보지 않으셨다 하셔서 다시 시도해봄.. 그런데 permission denied가 뜨네?

 

참조 : https://harrydony.tistory.com/743

 

aws, winSCP 'permission denied' 문제 해결하는 방법

기준 환경 AWS EC2 Cent OS7 (t2.micro) Cent OS Web Server $ yum install - y httpd (혹은 sudo yum install -y httpd) 생성한 보안그룹 인바운드 : 모든 TCP Default값(소스 위치무관) 아웃바운드 : 모든 TCP Default값(소스 위치

harrydony.tistory.com

뭔가 당장 사용해보기엔 무리가 있어보인다..

 

그래서 .gitignore에서 media를 풀고 이미지만 업로드할까도 고민해보았는데..

확인해보니까 깃허브 웹상에서 파일을 업로드하는게 가능하네?

바로 default.jpeg 업로드한뒤 ec2에서 pull

받은 디폴트 이미지를 media/profile에 옮겨서 docker compose를 다시 틀어보았다

 

왜?

 

아마도 배포환경에서는 postgres로 미디어, 스태틱 파일들을 collectstatic을 하는 명령어가 있는데 그 영향인지 경로가 꼬이는듯?

 

 

결국 프론트엔드 부분에서 프로필의 경로가 default일때 src를 프론트엔드쪽으로 변경시키는 쪽으로 급하게 기워고쳤다

 

if (image.src = `${backend_base_url}/media/profile/default.jpeg`) {
      image.src = `${frontend_base_url}/static/img/default.jpeg`
    }

 

 

프론트엔드 img 폴더 안에 있는 이미지파일로 실험까지 확인완료!

 

 

 

p.s. 

 

악.. 이미지가 있어도 src가 default로 대처되는 사태가 발생

조건문을 쓸 때에는 =가 아니라 ==여야하네 ㅋㅋ

if (image.src == `${backend_base_url}/media/profile/default.jpeg`) {
      image.src = `${frontend_base_url}/static/img/default.jpeg`
    }