24년 11월 중순 정도, 프로그래머스에서 진행한 특강을 잠깐 참여했을 때스피커가 설명하던 개념이 preflight request였습니다. 당시 스피커는 “여러분은 CORS가 왜 발생하는지 아세요?”라는 질문에 이어“브라우저가 서로 다른 도메인에 리소스 요청을 어떻게 파악하는지 아세요?”라고 말했고preflight를 언급한 2-3명의 인원을 제외하고선 약 150명 정도의 인원이 참여했던 채팅방은도서관이 되어버렸습니다.(무려 3년 차까지 참여한 방이었는데 말이죠.) 저도 preflight에 대해 개념은 설명이 가능했지만 preflight를 사용했을 때의 장점이나CORS를 제외한 preflight로 요청되는 경우는 몰랐기에 필요시 참고하려고 포스팅했습니다.Preflight Request의 특징1) 프론트엔드..

1. 문제 발생development 환경에서 작업을 완료 후 vercel을 활용해 production 환경으로 배포 후API 통신 동작을 체크했을 때, https통신이 중간에서 http로 변경되어져요청이 들어가는 문제를 경험했습니다.2. 해결하기 위한  시도Api 엔드 포인트를 변경하거나, 백엔드에 변경 사항이 있는지 질문도 해보고vercel 환경 변수도 재설정해줬지만 계속 http로 요청이 이뤄졌는데요.3. 해결 방법next.js의 src > app > layout.tsx에 meta tag를 설정해주는 것으로 해결할 수 있었습니다. 위의 meta tag를 적용하면 http 콘텐츠를 자동으로 https로 변환이 이뤄집니다.