ice rabbit programming

최근 Vue.js를 사용하며 WebPack을 사용했는데, local에서 proxy table의 사용을 환경 변수에 따라 다르게 설정하고 싶었다. (webpack이 아닌 vue-cli를 활용한다면 이 글을 참고) dotenv 패키지 적용 그러던 중에 dotenv 패키지를 찾아서 적용하였다. npm install dotenv dotenv 패키지는 여러 프레임워크에 존재하는데, .env 파일을 통해 환경 변수를 설정해주는 패키지이다. const dotenv = require('dotenv'); dotenv.config(); 이렇게 간단하게 사용할 수가 있는데, dotenv.config 내에 아무 것도 명시해주지 않으면 루트에 있는 .env 파일을 찾아 적용하게 된다. 경로를 지정해주고 싶으면 아래와 같이 적으..

webapp과 webapi를 분리하여 개발하다보면, webapi 호출이 CORS 이슈로 인해 제대로 불리지 않는 경우가 많다. CORS는 Cross Origin Resource Sharing로, 도메인 또는 포트가 다를 경우에 호출을 허용하지 않는 정책을 말한다. 보안을 위해 고안된 정책으로, SPA를 기반으로 호출할 때에는 번거로운 것이 사실이다. 물론 개발 서버나 운영 서버에 올리고 나면 백엔드에 render를 붙이든, 따로 구성했지만 nginx를 통해 내부 호출을 구성하든간에 CORS 이슈를 위반하지는 않게 되어 운영상에 문제되지는 않는다. 다만 local에서 개발할 때 API 호출을 통해 테스트가 되어야 코드를 올리고, 빌드를 하고 배포가 될 것이다. CORS를 해결하기 위해 크게 두 가지 방법이..