Các website thường chèn ứng dụng bản đồ để giúp khách hàng định vị được vị trí cửa hàng, công ty và tăng tính tương tác, trong đó, phổ biến nhất là Google Maps API. Trước đây, việc chèn Google Maps được thực hiện khá đơn giản và nhanh chóng. Tuy nhiên, Google đã có sự thay đổi trong việc sử dụng và tính phí của ứng dụng này.
 

  • Các website (tích hợp trước ngày 22/6/2016) sẽ không bị tắt quyền truy cập API nhưng buộc phải bật thanh toán nếu không muốn xuất hiện thông báo lỗi trên website

  • Các website (tích hợp sau ngày 22/6/2016) sẽ ngay lập tức bị báo lỗi ứng dụng nếu không bật thanh toán.

Bài viết này sẽ hướng dẫn các bạn đăng ký, kích hoạt tính năng thanh toán và thay key Google Maps API trên website để Google Maps có thể hiển thị tốt trên website của mình.
 

API Google Map

Nhắc nhở của Google: Kể từ ngày 16 tháng 7 năm 2018, để tiếp tục sử dụng API nền tảng Google Maps, bạn phải bật thanh toán cho từng dự án của mình. Nếu bạn chọn không thêm tài khoản thanh toán, bản đồ của bạn sẽ bị xuống cấp hoặc các yêu cầu API Maps khác sẽ trả lại lỗi.

Để sử dụng API Bản đồ, Tuyến đường và Địa điểm của Google Maps:

  • Tất cả yêu cầu API nền tảng Google Maps phải bao gồm khóa API; Google không còn hỗ trợ truy cập keyless nữa.

  • Phải bật thanh toán cho từng dự án của mình

Đăng ký và lấy key API của Google Maps

Bước 1: Cần có tài khoản Google. Bạn có thể sử dụng tài khoản cũ của mình hoặc đăng ký mới tại
https://accounts.google.com/signup/

Bước 2: Đăng nhập vào tài khoản Google

Bước 3: Truy cập đường dẫn https://console.cloud.google.com/?hl=en&pli=1

Khởi tạo tài khoản Google Cloud Platform theo hướng dẫn để bắt đầu sử dụng dịch vụ.
 

Bước 4: Tạo project mới trên Google Cloud Platform

(Nếu đã có sẵn project có thể bỏ qua bước này)

Click vào Select a project -> Click NEW PROJECT để tạo project mới
 

Đặt tên project -> chọn CREATE
 

*Lưu ý: Tên project phải thỏa mãn:

  • Không dấu

  • Không khoảng trắng

  • Không sử dụng kí tự đặc biệt (Trừ dấu gạch ngang "-")

  • Có từ 4 - 30 ký tự

Bước 5: Chọn project cần tạo Google Maps API

Tại menu bên trái, bạn kéo xuống cuối, tìm OTHER GOOGLE SOLUTTIONS -> APIs
 

 Giao diện Maps APIs and services sẽ hiện ra -> Chọn Maps JavaScript API -> Enable
 
Bước 6: Tạo API Key

Sau khi bật Google Maps API thành công. Bạn sẽ được chuyển hướng tới giao diện sau.

Chọn Credentials in APIs & Services -> CREATE CREDENTIALS -> API key
 
Sau khi Click vào API key, Google sẽ tự động tạo ra 1 đoạn mã ngẫu nhiên cho bạn.
 

Vậy là cuối cùng bạn cũng có được một Google Maps API key cho riêng mình rồi. Lưu lại đoạn key này nhé!

Bước 7: Bổ sung thông tin cho key

Kích chọn API key 1 vừa tạo:
 

Tại Application restrictions: Chọn HTTP referrers (web sites)
Tại Website restrictions; Chọn ADD AN ITEM -> Nhập địa chỉ website mà bạn muốn gắn Google Maps  -> DONE
 
Sau đó SAVE lại.

Kết quả:
 

Bật thanh toán

Bước 1:

  • Để bật thanh toán, bạn ra lại màn hình chính của Google Cloud Platform. 

  • Tại menu phải, chọn Billing -> Link a billing account -> CREATE BILLING ACCOUNT

Bước 2: Tạo tài khoản thanh toán

Làm theo hướng dẫn trong ảnh
Tích chọn đồng ý với điều khoản dịch vụ -> CONTINUE
 
 
Điền thông tin theo yêu cầu
 
Lựa chọn hình thức thanh toán và điền thông tin thẻ tín dụng -> Chọn START MY FREE TRIAL
 

Bật thanh toán thành công!

*Lưu ý

Yêu cầu khi sử dụng thanh toán là Quý khách phải có thẻ tín dụng và chú ý không gỡ bỏ thẻ tín dụng sau khi nhận được 12 tháng dùng thử. Việc tính phí và thanh toán sẽ dựa trên chính sách của Google.

Thay key cho web

Sau khi đã có API key thì các bạn gửi lại cho Tất Thành để add key vào trong code. (key này cũng ko thường xuyên thay đổi nên tùy trang web Tất Thành mới code thêm chức năng điền key trong quản trị)