최근에 이미지 업로드에 관한 로직을 변경하면서 제목과 같은 에러를 보게 되었다.
내가 근무하는 회사에서 이미지를 업로드 하기 위해서는 아래처럼 두 프로세스를 순서대로 거쳐야 한다.
1) 클라이언트에서 람다(static 서버)로 POST 요청을 하여 그 결과로 파일을 업로드 해야 할 주소(s3) 및 실제 이미지 경로 반환
2) 클라이언트에서는 위의 결과의 파일을 업로드 해야 할 주소로 PUT 요청을 하는데 이 때 실제 업로드 할 파일 제공
=> 위 두 가지 작업이 성공적으로 수행 되면 실제 버킷에 이미지가 들어가 있고, 이미지 경로에 접근 시 업로드 한 이미지가 표시 된다
기존에는 위 두 가지 작업을 클라이언트에서 하고 있었다.
하지만 최근에 next.js 를 사용하는 이점을 살려보고자 업로드 로직을 다음과 같이 변경해보았다.
- 클라이언트는 next.js 의 서버사이드에 파일만 전달
- next.js 서버 사이드에서 파일 업로드에 필요한 위의 두 작업을 처리
- 처리 후 이미지 url만 응답으로 반환
- 클라이언트는 이미지 url 사용
이렇게 변경한 이유는 클라이언트 사이드에서 이미지 업로드에 관한 처리를 할 필요가 있나? 싶어서였다.
단순히 파일을 던져주고 이미지 url 만 받아서 사용하면 되지..
이미지 업로드에 관한 일련의 처리는 서버 사이드에서 해주면 되지.. 라는 생각으로. (next.js 를 사용하고 있어서 가능한걸 수도?)
그런데 문제가 생겼다.
로컬에서는 잘 작동하던 업로드 기능이, 실제 환경에 배포하고 시도하니 다음과 같은 에러가 발생했다
HTTP 상태 코드 413 의 내용은 다음과 같다
????
엘라스틱 빈스톡에서는 nginx 를 내장하고 있었고, 이 놈이 에러를 반환하고 있었다.
원인은 nginx 는 클라이언트의 요청 body 의 사이즈를 기본 1MB 로 해놓았기 때문이다
그렇다면 엘라스틱 빈스톡에 올라가 있는 인스턴스의 nginx 설정을 바꿔야 한다고 생각이 들었다.
처음에는 인스턴스에 ssh 연결해서 nginx 파일을 수정하려고 생각했지만 이 방법은 새로운 버전의 앱이 배포 될 때
어차피 사라질 설정이었다. (즉, 설정의 변경이 지속되지 않는다)
그렇다면 어떻게 엘라스틱 빈스톡의 nginx 설정을 배포 할 때마다 내가 원하는 대로 바꿔줄 수 있을까??
방법은 생각보다 간단하다. (※ ELB 플랫폼이 Amazon Linux 2 인 경우)
프로젝트 폴더에 .platform 이라는 폴더 하위에 설정하고자 하는 폴더 및 파일을 만들어주면 된다.
나는 nginx 의 환경설정을 변경하는 것이므로 다음과 같이 폴더 및 파일을 생성해주었다.
참고로 conf.d 내에 파일이름은 여러분들이 알아서 설정을 해주어도 된다.
이 상태로 엘라스틱 빈스톡에 배포를 하고 -> 이미지(또는 파일)를 업로드 하게 되면 정상적으로 잘 되는 것을 확인할 수 있다!!!
끝!
================================================================================
+) 상위 폴더를 .platform 이 아닌 .ebextensions 로 하라는 예제들도 많이 볼 수 있는데, 실제 반영되지 않는다.
+) 구글링을 하다보면 설정 파일의 이름을 proxy.conf 로 만드는 예제를 볼 수 있는데, 꼭 그러지 않아도 된다
먼저 아래 사진을 살펴보자
위 내용은 인스턴스에 떠 있는 nginx.conf(/etc/nginx) 의 내용인데, 밑줄 쳐진 내용을 보면 conf.d 폴더 내에 .conf 로 끝나는 모든 파일을 포함한다는 것을 알 수 있다.
'끄적끄적' 카테고리의 다른 글
| 프로그래머스 SQL 문제 다 풀었다~! (2) | 2022.07.09 |
|---|