개발을 하던중 요청 url 이 잘 적용되었는지 확인하려고 개발자도구의 네트워크상에서 미리보리를 보려했는데 위와 같은 문구와 함께
볼수가 없었다.
하지만 코드상에서 console.log로 찍어서 하나하나 확인할 수 있어 대수롭지 않게 하나씩 디버깅을 해서 개발을 해도 문제가 없었다.
즉, 서로간의 통신은 잘되지만 특정 프리플라이트 요청 에서는 안되는 것이다.
프리 플라이트 요청이란 ?
- 본 요청을 보내기 전에 사전에 물어본다.
- 클라이언트는 서버에 사전 요청을 보내 확인하고, 서버는 해당 사전 요청에 응답을 한다.
- 서버가 사전 요청을 허용했다면 다시 본 요청을 보낸다.
- 총 2번의 통신을 주고 받는다.
- 프리플라이트 요청 포맷
- Origin: 요청 출처
- Access-Control-Request-Method: 실제 요청 메소드
- Access-Control-Request-Headers: 실제 요청의 추가 헤더
- 프리플라이트 응답 포맷
- Access-Control-Allow-Origin: 서버 측 허가 출처
- Access-Control-Allow-Method: 서버 측 허가 헤드
- Access-Control-Allow-Headers: 서버 측 허가 헤더
- Access-Control-Max-Age: 프리플라이트 응답 캐시 시간
- 프리플라이트 응답 메시지가 가져야할 특징
- 응답 코드는 200대여야 한다.
- 응답 body는 비어있어야 한다.
우선 개발하는데 큰 지장은 없어 따로 설정은 하지 않지만 차후 이러한 원인 때문에 지장이 있을 수 있으니 개념 정리 까지만 !