인생은 효율성

출처(Origin)란? CORS를 알아보기 이전에 '출처'라는 것이 무엇인지 먼저 알아야 한다. 출처는 서버의 위치를 뜻하고 프로토콜, 호스트, 포트로 구성되어있다. 우리가 로컬에서 개발하면서 자주 보는 아래 같은 주소를 구분하자면 이렇다. https://localhost:3000 Protocol Host Port 경우에 따라서 이 뒤에 Path, Query string, Fragment가 붙을 때도 있지만 출처(Origin)는 위의 URL구성을 뜻한다. 콘솔로 location객체의 origin프로퍼티를 출력해보면 현재 출처를 알 수 있다. CORS의 뜻 개발을 하다 보면 CORS를 자주 접하게 되는데 이와 관련해서 SOP라는 정책이 있다. SOP는 간단하게 설명해서 같은 출처에서 리소스를 공유할 수 있..

API 인증키 노출 방지 깃에 public으로 소스를 올릴 것이기 때문에 내 인증키가 노출되지 않도록 설정해야 한다. 전역 폴더에 .env파일을 생성해서 아래처럼 파일에 내 인증키를 저장한다. 저장한 인증키를 사용할때는 아래와 같이 파일에서 인증키를 가져오면 된다. CORS에러 파이썬으로 토이 프로젝트를 했을 때에는 내가 직접 백엔드를 개발했었기 때문에 백에서 cors처리를 해주면 되었다. 그런데 이번에는 제공되는 API에서 데이터를 가져와야 하기 때문에 그 방법을 사용할 수 없었다. 그래서 package.json에서 proxy설정을 해주어 해결했다. 그러면 URL부분에 proxy에서 설정한 다음의 주소만 써주면 된다. favicon을 못찾는 에러 초기에 리액트 프로젝트가 생성될 때 같이 딸려오는 아이콘..