Google Maps API 演示 - google 未定義

Question

我正在嘗試實作Google Maps API，並且一直在關注官方的Demo。

我複製了程式碼，只做了一個更改：

// Raises an error: Access to script at 'file:///D:/Desktop/Stuff/map-test/test.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted.
    <script type="module" src="./index.js"></script>

    // Changed to this
    <script src="./index.js"></script>

結果，我收到以下錯誤：

ReferenceError: google is not defined at initMap

我猜這是由於從腳本中刪除了 type="module" 造成的？大多數人如何實現它，因為似乎您需要自己託管模組才能為此導入它？

我已將程式碼更改為以下內容，但這會引發警告。

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key= API_KEY"></script>

// Warning: Google Maps JavaScript API has been loaded directly without a callback. This is not supported and can lead to race conditions and suboptimal performance. For supported loading patterns please see https://goo.gle/js-api-loading< /pre>
<p>謝謝！ </p>
<p>編：</p>
<p>我閱讀了之前關於使用 HTTP 伺服器託管檔案的答案，我誤解了他們的意思是託管 JS 檔案。相反，您應該在本地託管 HTML 文件以進行測試，而不是直接打開 HTML 文件（即在文件資源管理器中雙擊它）。 </p>
<p>所以用 python3：</p>
<pre class="brush:php;toolbar:false;"># in the directory that contains index.html:
python3 -m http.server 8080

造訪 http://localhost:8080/index.html 對我有用。謝謝！

Answer 1

我閱讀了之前關於使用 HTTP 伺服器託管文件的答案，我誤解了他們的意思是託管 JS 檔案。相反，您應該在本地託管 HTML 文件以進行測試，而不是直接打開 HTML 文件（即在文件資源管理器中雙擊它）。

所以使用 python3：

# in the directory that contains index.html:
python3 -m http.server 8080

造訪 http://localhost:8080/index.html 對我有用。謝謝！