CloundFront + ALB 접근제어하기

지금 겪고 있는 상황

Frontend는 react 기반으로 S3에 올려서 CloudFront로 서비스 제공 중
Backend는 node.js 기반으로 EC2에 올려서 ALB로 서비스 제공 중
Backend API ALB에서 따로 접근제어를 하지 않다보니 외부 트래픽 공격에 노출됨
- 누군가 계속 이상한 값을 body에 넣어 전송중
```
{
  "0x[]" : "androxgh0st"
}
```

해결방법 (자세한 내용은 아래 공식 문서 확인)

요청에 사용자 지정 HTTP 헤더를 추가
ALB로 보내는 요청에 사용자 지정 HTTP 헤더를 추가하여 구성하실 수 있습니다.
특정 헤더가 포함된 요청만 전달하도록 Application Load Balancer 구성
오리진 요청에 HTTPS 사용

외부 트래픽은 해당 헤더가 없을테니까 로드밸런서를 뚫고 접근할 수 없을것이다.

트러블슈팅

front에서 api호출시 헤더에 커스텀 HTTP 헤더를 CORS에러 발생

원인: API 요청시, OPTION 메소드로 먼저 호출되는 Preflight 요청시 “커스텀 헤더를 사용할거야!”라는 의미를 나타내는 헤더를 사용하지 않아서 발생함
- Access-Control-Request-Headers에 위에서 만든 커스텀헤더를 추가하여 해결

참고

책 후기 - 사용자를 생각하게하지마 circleCI에서 glob패턴 사용시 주의점