안녕하세요.
|
Team FLOW입니다.

thumbnail
Nginx CORS + https 설정 문제 해결하기

Nginx 기존 설정 파일은 아래와 같다. 하지만 원인을 알 수 없는 CORS 오류가 자꾸 발생했다. Frontend, Backend 코드 모두 뜯어보고 고쳐보았으나 전혀 방법이 없었는데, 시험 삼아 nginx를 거치지 않고 요청을 보내보니 잘 전송되는 것을 확인할 수 있었다. 😨 즉, CORS의 원인은 nginx 때문이었던 것! nginx CORS 오류 수정하기 처음에 옵션을 적용할 경우 원본 서버의 헤더가 있는 경우 을 추가하면 해결된다고 하여 추가했다. 하지만, CORS오류는 여전히 해결되지 않았고, 아래와 같이 와일드 카드를 제거하고 옵션을 추가했다. (이 옵션은 추후 쿠키 사용을 위해 추가한 것도 있다.) 그러나 여전히 해결되지 않았다………ㅠ_ㅠ 위 오류 메세지를 다시 참고했는데, Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response. 즉…

Server Production 환경 구축하기(1) - VPC와 서브넷으로 EC2 추가하기

VPC(Virtual Private Cloud) image https://velog.io/@server30sopt/VPC-서브넷-설정으로-RDS에-안전하게-접근하기 물리적으로는 같은 클라우드 상에 있으나, 보안상의 목적을 위해 논리적으로 다른 클라우드인 것처럼 동작하도록 만든 가상 클라우드 환경 VPC 별로 다른 네트워크를 설정할 수 있으며, 독립된 네트워크처럼 작동한다. 만약 VPC를 설정하지 않은 경우 아래와 같은 구조를 띈다. image 하나의 VPC는 하나의 Region 내에서만 생성이 가능하지만, 두 개 이상의 리전에 걸치는 것은 불가능하다. 하지만 하나의 VPC는 여러개의 Amazon Availability Zone에 걸쳐서 생성될 수 있다. VPC 구조 image 서브넷(Subnet) 보안, 통신 성능 향상 등을 목적으로 VPC를 쪼갠 단위 Public Subnet 외부에서 접근 가능한 네트워크 영역 인터넷 게이트웨이, ELB, Public IP / Elastic IP…

무한 스크롤 기능 구현하기 (with No Offset)

OFFSET 방식의 페이지 처리 문제점 일반적인 페이지네이션 방식은 아래와 같다. 와 명령어를 이용하면 (어디부터) LIMIT(몇개의) 데이터를 불러올지 결정한다. 이를 이용해 을 페이지 번호로 활용한다. (offset = page size * page number) OFFSET의 경우 앞에서 읽었던 행을 다시 읽기 때문에, 페이지 번호가 뒤로 갈수록 더욱 느려진다는 문제점이 있다. image https://jojoldu.tistory.com/528 만약 OFFSET이 1000이고, LIMIT이 10일 경우, 1,000부터 10개를 읽어야 하기 때문에 1,010개의 데이터를 읽는다. 즉, 뒤로 갈수록 버려야하지만 읽어야 할 데이터가 많기 때문에 느려지는 것이다. No OFFSET 페이지네이션 위 쿼리처럼 을 사용하지 않고 페이지네이션을 수행한다는 의미이다. 조회 시작 부분을 인덱스로 빠르게 찾아 첫 페이지만 읽도록 하는 방식이다. No OFFSET으로 무한 스크롤 구현하기 구현…

GlobalExceptionHandler 리팩토링

기존 코드 기존 코드의 경우 Handler에 너무 많은 책임이 있었고, 통일되지 않아 지저분한 느낌이 들었다. 위 코드만 봐도 알 수 있듯이 크기가 클수록 코드의 양이 길어지고 통일성이 사라진다. 모든 예외를 전부 처리해야하기 때문에 코드의 양이 길어지며, 확장성 역시 떨어진다. 코드 리팩토링 모든 을 처리하는 을 하나 생성한다. 해당 을 처리하는 를 생성한다. 위 코드를 통해 필요한 에러만 핸들링하도록 수정함으로써 재사용성을 높였다. 모든 예외처리 클래스가 을 상속받도록 하면, 어디서든 와 를 받을 수 있다. 위와 같이 처리함으로써 예외처리 코드 및 응답의 통일성, 확장성, 의 코드 크기를 줄일 수 있다. 향후 새로운 커스텀 오류를 처리하고 싶은 경우 을 상속받아 생성하고, 위 예시와 같이 사용하면 된다. 참고 자료 상속을 활용한 Global Exception Handler 리팩토링