Google Maps API 데모 - Google 정의되지 않음
P粉269847997
2023-09-02 18:33:34
<p>Google Maps API를 구현하려고 하며 공식 데모를 따르고 있습니다. </p>
<p>코드를 복사하고 한 가지만 변경했습니다. </p>
<pre class="brush:php;toolbar:false;">// 오류 발생: 원본에서 'file:///D:/Desktop/Stuff/map-test/test.js'에 있는 스크립트에 액세스 CORS 정책에 의해 'null'이 차단되었습니다. 교차 출처 요청은 프로토콜 구성표(http, 데이터, 격리된 앱, chrome-extension, chrome, https, chrome-untrusted)에만 지원됩니다.
<스크립트 유형="모듈" src="./index.js"></script>
// 이렇게 변경됨
<script src="./index.js"></script></pre>
<p>그 결과 다음과 같은 오류가 발생했습니다. </p>
<pre class="brush:php;toolbar:false;">ReferenceError: google이 initMap에 정의되어 있지 않습니다</pre>
<p>스크립트에서 <code>type="module"</code>을 제거했기 때문인 것 같습니다. 이를 위해 모듈을 가져오려면 모듈을 직접 호스팅해야 하는 것 같으니 대부분의 사람들은 이를 어떻게 구현합니까? </p>
<p>코드를 다음과 같이 변경했는데 경고가 발생합니다. </p>
<pre class="brush:php;toolbar:false;"><스크립트 유형="text/javascript"src="https://maps.googleapis.com/maps/api/js?key= API_KEY"></script>
// 경고: Google Maps JavaScript API는 콜백 없이 직접 로드되었습니다. 이는 지원되지 않으며 경쟁 조건 및 차선의 성능으로 이어질 수 있습니다. 지원되는 로드 패턴은 https://goo.gle/js-api-loading< /pre>
<p>감사합니다! </p>
<p>편집자:</p>
<p>HTTP 서버를 사용하여 파일을 호스팅하는 방법에 대한 이전 답변을 읽었으며 JS 파일 호스팅의 의미를 오해했습니다. 대신 HTML 파일을 직접 여는 것(예: 파일 탐색기에서 두 번 클릭)보다는 테스트 목적으로 HTML 파일을 로컬에서 호스팅해야 합니다. </p>
<p>그러므로 python3을 사용하세요: </p>
index.html이 포함된 디렉토리의 <pre class="brush:php;toolbar:false;">#:
python3 -m http.server 8080</pre>
<p>http://localhost:8080/index.html을 방문하는 것이 저에게 효과적입니다. 감사해요! </p>
HTTP 서버를 사용하여 파일을 호스팅하는 방법에 대한 이전 답변을 읽었으며 JS 파일 호스팅의 의미를 오해했습니다. 대신 HTML 파일을 직접 여는 것(예: 파일 탐색기에서 두 번 클릭)보다는 테스트 목적으로 HTML 파일을 로컬에서 호스팅해야 합니다.
그러므로 python3을 사용하세요:
으아악http://localhost:8080/index.html을 방문하는 것이 저에게 효과적이었습니다. 감사해요!