[FAQ] 지도/로컬 API 문의 전 꼭 읽어 주세요.
https://devtalk.kakao.com/t/faq-api/125610
React, Next.js14 버전으로
'use client';
import { useEffect } from 'react';
declare global {
interface Window {
kakao: any;
}
}
export default function KakaoMap({ image }: any) {
useEffect(() => {
const mapContainer = document.getElementById('map'); // 지도를 표시할 div
const mapOption = {
center: new window.kakao.maps.LatLng(37.566826, 126.9786567), // 지도의 중심좌표
level: 3, // 지도의 확대 레벨
};
new window.kakao.maps.Map(mapContainer, mapOption); // 지도 생성
});
return <div id="map" style={{ width: '500px', height: '400px' }}></div>;
}
아래와 같이 적용했는데
Third-party cookie will be blocked. Learn more in the Issues tab.
이와 같은 에러와 함께 지도가 표시되고 있지 않습니다.
혹시 해결방안을 알 수 있는지 궁금합니다.
참고로 head 내에
이렇게 적용했는데 혹시 이 방식도 맞는지 궁금합니다.