Làm cách nào để bảo vệ khóa API Google Maps trên ứng dụng Ionic?

Tôi có ứng dụng Ionic PWA được xuất bản cho Android và iOS (Tôi đã sử dụng Tụ điện để tạo bản dựng gốc). Trong mã frontend, nó có khóa API Google Maps của tôi, tuy nhiên, tôi không thể giới hạn nó trong bất kỳ tùy chọn nào mà Google cung cấp vì ...

1. Giới thiệu HTTP - Nó không phải là một tên miền công cộng, nó nằm trên một máy chủ lưu trữ cục bộ trong chế độ xem web của ứng dụng gốc. http://localhost/cho Android và capacitor://localhost/cho iOS. Có vẻ như không an toàn khi sử dụng những hạn chế này vì chúng rất chung chung và tất cả các ứng dụng khác sẽ có cùng một ứng dụng.

2. Địa chỉ IP - Vì lý do rõ ràng.

3. Ứng dụng Android - Nó không nằm trong mã gốc, nó nằm trong một webview.

4. Ứng dụng iOS - Nó không nằm trong mã gốc, nó nằm trong một webview.

   

Không có lựa chọn nào trong số này có thể làm việc cho tình huống của tôi. Vậy làm cách nào để bảo vệ khóa API của tôi khỏi bị lạm dụng?

Có ý kiến ​​gì không? Tôi không thể là người duy nhất sử dụng Google Maps API trong ứng dụng Ionic.

Bạn có thể định cấu hình tên máy chủ của ứng dụng tụ điện

"server": {
    // You can configure the local hostname, but it's recommended to keep localhost
    // as it allows to run web APIs that require a secure context such as
    // navigator.geolocation and MediaDevices.getUserMedia.
    "hostname": "unique-app",
  }

và sau đó giới hạn các khóa API để capacitor://unique-app

https://capacitor.ionicframework.com/docs/basics/configuring-your-app

Để bảo vệ khóa API của bạn, bạn phải kiểm tra giá trị của window.location.hreftrong một lần xem web. Tôi đoán bạn sẽ thấy một cái gì đó như file://some/path.

Vì vậy, bạn sẽ cần áp dụng hạn chế giới thiệu HTTP cho đường dẫn này. Lưu ý rằng các URL có tệp: // giao thức yêu cầu biểu diễn đặc biệt như được giải thích trong

https://developers.google.com/maps/documentation/javascript/get-api-key#restrict_key

Lưu ý: file: // tham chiếu cần một đại diện đặc biệt để được thêm vào hạn chế khóa. Phần "file: //" phải được thay thế bằng "__file_url__" trước khi được thêm vào hạn chế khóa. Ví dụ: "file: /// path / to /" phải được định dạng là "__file_url __ // path / to / *". Sau khi bật tệp: // người giới thiệu, bạn nên thường xuyên kiểm tra việc sử dụng của mình để đảm bảo nó phù hợp với mong đợi của bạn.

Tôi hi vọng cái này giúp được.