오늘도 맑음

CORS 오류는 다른 출처의 리소스를 요청할 때 발생할 수 있다.자신의 출처(도메인, 프로토콜, 포트)와 다른 서버에 요청을 보낼 때 CORS 오류를 발생시키지 않으려면 별도의 세팅을 해야한다.정석적으로는 백엔드에서 처리하지만 백엔드와 소통이 안되는 경우 혹은 공공 API를 사용하는 경우에 프록시 서버를 통해 클라이언트에서도 처리할 수 있다.⭐ 원리 설명1. 웹 브라우저가 서버에 리소스를 요청할 경우 자동적으로 요청 헤더의 Origin에 출처를 담아서 보낸다.2. 서버에서는 모든 요청에 대해 환영하고 응답을 보내는 데 응답 헤더의 Access-Control-Allow-Origin에 허용할 출처를 담아서 응답한다.3. 웹 브라우저가 응답을 받기 전에 요청 헤더의 Origin과 응답 헤더의 Access-Co..

상황로컬에서 실행할 때는 warning인 것들이 배포 시에는 오류가 되어 빌드가 안되는 문제가 발생한다.Building에서 실패하여 다른 단계로 넘어가지 못한 것을 확인했다. 원인빌드 시에 문제가 생겼을 때 로그를 확인할 수 있다.아래 로그를 보면 사용하지 않는 useState, React 를 선언하여 문제가 발생했다. 해결 방법1. 모든 warning을 해결한다. ⭐2. CI = false로 비활성화 첫번째 방법수정 후 다시 push 하면 빌드가 성공적으로 마치고 정상 배포된 것을 확인할 수 있다. 두번째 방법이 방법은 정석적인 방법은 아니지만 Bulid command를 CI = false npm run build 로 변경하여 해결할 수도 있다.CI 환경에서 빌드를 하면 일부 라이브러리가 이전에는 단지..

CORS 에러란?Cross-Origin Resource Sharing의 약어이다. 한국어로는 교차 출처 리소스 공유이며, 다른 출처(Origin)로 리소스를 요청하는 방식을 일컫는다.CORS는 최신 브라우저의 동일 출처 정책(Same-Origin Policy) 때문에 등장하게 되었으며, 다른 출처일 때도 리소스를 공유하기 위해 프론트와 백엔드는 별도의 설정을 해주어야 한다.CORS 에러는 언제 발생할까?다른 출처(Origin)로 리소스를 요청할 때 발생한다.URL 구조에서 프로토콜과 호스트가 모든 같은 것을 동일 출처라고 한다. 프로토콜, 도메인, 포트번호 중 하나라도 다르면 다른 출처이다.이전에는 동일한 도메인에서 리소스를 받아왔는데, 지금은 클라이언트에서 다른 서버(ex. Backend, Oauth)..