Giới thiệu Google Maps JavaScript API Cách Tích Hợp Bản Đồ Vào Website Với API Key

URL

https://maps.googleapis.com/maps/api/js?key=AIzaSyBVWaKrjvy3MaE7SQ74_uJiULgl1JY0H2s&sensor=false

là để tải Google Maps JavaScript API, cụ thể là:

✅ Công dụng:

Đây là thư viện chính của Google Maps JavaScript API – khi bạn nhúng đoạn <script> này vào trang web, nó sẽ:

• Tải SDK Google Maps cho JavaScript.
• Cho phép bạn:
  • Vẽ bản đồ Google trong một thẻ <div>.
  • Thêm marker (ghim vị trí).
  • Dùng các tính năng như: tìm đường (Directions), tìm địa điểm (Places), bản đồ vệ tinh (Satellite), v.v.
  • Giao tiếp qua bản đồ (zoom, pan, click event...).

🧱 Các thành phần chính trong URL:

⚠️ Cảnh báo:

API key bạn đang dùng:

AIzaSyBVWaKrjvy3MaE7SQ74_uJiULgl1JY0H2s

có vẻ là public hoặc đang để lộ. Nếu key này không được giới hạn domain (HTTP referrers), người khác có thể dùng nó để lạm dụng quota hoặc gây tốn phí cho bạn.

👉 Bạn nên:

1. Truy cập https://console.cloud.google.com/apis/
2. Chọn Project đang dùng key đó.
3. Vào "Credentials" → API Key
4. Bật giới hạn domain (chỉ cho phép từ yourdomain.com), giới hạn dịch vụ chỉ cho Maps JavaScript API.

🧪 Ví dụ dùng:

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>

<script>
  function initMap() {
    new google.maps.Map(document.getElementById("map"), {
      center: { lat: 21.0285, lng: 105.8542 },
      zoom: 14,
    });
  }
</script>

<div id="map" style="width: 100%; height: 400px;"></div>