[FAQ] 지도/로컬 API 문의 전 꼭 읽어 주세요.
https://devtalk.kakao.com/t/faq-api/125610
axios
.get(`${API_URL}/view-map`)
.then((response) => {
const data = response.data;
console.log(data);
Array.from(data).forEach((element) => {
// console.log(element.count);
let seatImage;
if (element.count <= 15) {
seatImage = seatGreen;
} else if (element.count > 15 && element.count <= 31) {
seatImage = seatYellow;
} else {
seatImage = seatRed;
}
localhost에서 console.log(data)를 찍었을 때는 배열 형태로 값이 제대로 받아와지는데
도메인에서는 html이 나오면서 TypeError: t.forEach is not a function 라는 에러가 떠 현재는 Array.from().forEach로 에러가 뜨지 않게 했지만 여전히 커스텀 오버레이가 뜨지 않는 상황입니다.
어떻게 하면 API_URL을 .env 파일에 정상적으로 숨기면서 지도에 커스텀오버레이가 뜨게 할까요?
.env 파일에 숨기지 않는 경우에는 정상적으로 커스텀오버레이가 ui에 표시됩니다.
[
{
"id": 3,
"name": "제주몰빵",
"address": "서울 광진구 능동로 209 세종대학교 학생회관 2층",
"count": 0,
"xmap": 37.549321,
"ymap": 127.075044
},
{
"id": 4,
"name": "팬도로시",
"address": "서울 광진구 능동로 209 학생회관 1층",
"count": 19,
"xmap": 37.549809,
"ymap": 127.075371
},
{
"id": 5,
"name": "카페딕셔너리",
"address": "서울 광진구 능동로 209 학생회관 1층",
"count": 0,
"xmap": 38,
"ymap": 126
}
]
위는 localhost에서 콘솔에 data를 찍었을 때 나오는 데이터 배열입니다!
