Penanganan Error

Halaman ini menjelaskan cara menangani error saat menggunakan Maps JavaScript API, dan class Place.

Google Maps JavaScript API menggunakan class berikut untuk error:

  • MapsNetworkError mewakili error jaringan dari layanan web (dapat mencakup error RPCStatus).
  • MapsRequestError mewakili error permintaan dari layanan web (yaitu, setara dengan kode 4xx di HTTP).
  • MapsServerError mewakili error sisi server dari layanan web (yaitu, setara dengan kode 5xx di HTTP).

Class MapsNetworkError, MapsRequestError, dan MapsServerError termasuk dalam Maps Core Library. Pelajari lebih lanjut pustaka.

Setiap class ini berisi properti berikut:

Properti code mengidentifikasi jenis error; properti endpoint mengidentifikasi endpoint yang menampilkan error (misalnya, PLACES_DETAILS). Karena MapsNetworkError adalah subclass dari Error, properti lain termasuk name dan message juga tersedia.

Cuplikan berikut menunjukkan struktur pesan error Maps:

  MapsRequestError: PLACES_GET_PLACE: INVALID_ARGUMENT: Error fetching fields: The provided Place ID: ChIJN5Nz71W3j4ARhx5bwpTQEGg**** is not valid.
  [error.name     ] [error.endpoint ] [error.code     ]
                    [error.message --->                ... ]
  

Error mentah mencakup semua yang ada dalam string error; error.message mencakup seluruh string error, kecuali error.name.

Cuplikan berikut menunjukkan penanganan error saat menggunakan class Place. Contoh ini menggunakan blok try/catch untuk menangani setiap dari tiga jenis error. Kode serupa dapat digunakan untuk menangani error untuk class Maps JavaScript API apa pun.

async function getPlaceDetails() {
    const { Place } = await google.maps.importLibrary("places") as google.maps.PlacesLibrary;
    const { MapsNetworkError, MapsRequestError, MapsServerError } = await google.maps.importLibrary("core") as google.maps.CoreLibrary;

    // Use place ID to create a new Place instance.
    const place = new Place({
        id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg****', // Pass a bad Place ID to trigger an error.
    });

    // Error handling for fetchFields.
    try {
        // Call fetchFields, passing the desired data fields.
        await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location'] });
    } catch (error: any) {
        if (error && error instanceof google.maps.MapsRequestError) {
            // HTTP 4xx request error.
            console.error('fetchFields failed: MapsRequestError - check the request parameters', error);
        } else if (error && error instanceof google.maps.MapsServerError) {
            // HTTP 5xx server-side error.
            console.error('fetchFields failed: MapsServerError', error);
        } else if (error && error instanceof google.maps.MapsNetworkError) {
            // Network error.
            console.error('fetchFields failed: MapsNetworkError', error);
        }  else {
            console.error('fetchFields failed: An unknown error occurred', error);
        }
    }
    // ...
}