Vue.js에서 카카오맵 API 사용하기
API 호출 Vue.js에서 카카오맵 API를 사용하려고 하면 문제가 있다. script에서 API를 불러와야 하는데, API KEY가 그대로 노출된다는 점이다. 이를 위해 환경 변수 파일(.env)에 API KEY나 Base URL 등을 넣어서 외부에서 볼 수 없도록 관리하는데, HTML에서는 동적 기능을 사용할 수 없기 때문에 .env에서 데이터를 읽어올 수 없다. API가 제대로 로딩되지 않을 경우 kakao is not defined를 만나게 된다. Vue 컴포넌트에서는 다음과 같이 선언해 API를 불러올 수 있다. mounted() { const script = document.createElement('script'); script.type="text/javascript" script.src ..
프론트엔드/Vue.js
2020. 6. 12.
