Skip to main content

Google API Errors - Common Errors and Resolutions

A list of Common Google API Errors and how to resolve them

Updated over 2 months ago


Here’s a quick, step-by-step way for the merchant to check the browser console for the “errors related to the google maps api” error on the Store Locator page:

  1. Open the Store Locator page

  2. Go to the exact Store Locator URL you configured in the app settings.

  3. Open the developer console

    • Windows/Linux (Chrome/Edge): press F12 or Ctrl + Shift + I

    • macOS (Chrome/Edge): ⌘ + ⌥ + I

    • Safari: Develop → Show Web Inspector (enable the Develop menu in Safari prefs if needed)

    • Firefox: Ctrl/⌘ + Shift + K

    • Or simply right-click → Inspect.

  4. Go to the Console tab

  5. If you don’t see it, click the “»” chevron and choose Console.

  6. Reload the page with the Console open

  7. Press Ctrl/⌘ + R so all initialization messages appear.

  8. Look for red error lines:

  9. The billing issue typically shows as something like:

“Geocoding Service: You must enable Billing on the Google Cloud Project …” (and may include links).

in error log: BillingNotEnableMapError


You must enable Billing on the Google Cloud Project at [https://console.cloud.google.com/project//billing/enable

Places API error: BillingNotEnabledMapError


For the Error ApiNotActivatedMapError - This means the api is not enabled for your Google Account or Project

or For the Error :1289 Geocoding Service: This API project is not authorized to use this API. For more information on authentication and Google Maps JavaScript API services please see: https://developers.google.com/maps/documentation/javascript/get-api-key

The Store Locator app requires the following 5 API to be enabled in order to run. Please use these links to enable them.


The message "API keys with referer restrictions cannot be used with this API" when interacting with Google Maps APIs indicates a mismatch between the type of API key restriction applied and the specific Google Maps Platform API being called.

Error: "RefererNotAllowedMapError"

This error indicates your referrer-restricted key doesn’t list the correct website domains. Fix:

  1. Open the Google Cloud Console.

  2. Navigate to APIs & Services → Credentials.

  3. Select your Maps JavaScript API key.

  4. Under "Key restrictions," enable HTTP referrers (websites).

  5. Add your website’s URL(s) with a wildcard (e.g., https://yourdomain.com/*).

  6. Save changes and retry loading the map.

Here's a breakdown:

  • These are typically used for client-side APIs, like the Maps JavaScript API, where the API key is exposed in the browser. They restrict API key usage to specific HTTP referrers (websites or domains).

    Opens in new tab

  • These are used for server-side APIs (web services), where the API key is used on a backend server. They restrict API key usage to specific IP addresses of the server making the requests.

    Opens in new tab

The Issue:

The error arises when you attempt to use an API key with HTTP referer restrictions for a Google Maps Platform API that is a web service (e.g., Geocoding API, Directions API, Places API Web Services). Web services expect IP address restrictions, not referer restrictions, as they are called from a server environment where referrer information may not be consistently available or relevant for security.

For Rose Perl we actually use both Client and Server side for our apps. The client side is when you display the map on your store. You can lock it down to only your website or shopify domains - this makes sure no one else uses your key to display maps on their websites.

However when you bulk upload files, we use the same api to import and it's coming from our services and servers. Note: This is masked by shopify so you don't see it. But that is why you are seeing the error message.

Resolution:

To resolve this issue, you need to ensure the API key's restrictions align with the type of Google Maps Platform API you are using:

  • For Web Services (Server-Side):

    • Create a new API key or modify an existing one in the Google Cloud Console.

    • Under "Application restrictions," select "IP addresses (web servers, cron jobs, etc.)" and add the IP address(es) of your server(s).

    • Under "API restrictions," select the specific Google Maps Platform APIs you intend to use (e.g., Geocoding API).

  • For Client-Side APIs (e.g., Maps JavaScript API):

    • Ensure your API key has "HTTP referrers (web sites)" restrictions applied, listing the domains from which your application will be accessed.

  • Fix Referrer Errors Option A:

    • Remove application restrictions by navigating to APIs & Services → Credentials in Google Cloud Console.

    • Select your API key, change "Application restrictions" to "None," and save changes.

  • Fix Referrer Errors Option B:

    • Create a new unrestricted server-side key in Google Cloud Console and update the app settings accordingly.

If you want to lock down your api by servername. Our Shopify App Servers are https://sp.roseperl.com and https://sl.roseperl.com. if you add those to your site you can import files using the admin tools. You can also use the Shortcut : https://*.roseperl.com/*

Best Practices for API Key Management

  1. Always use separate keys for client-side (JavaScript APIs) and server-side (web services) operations.

  2. Add proper restrictions for each key:

    • Client-side APIs: Use HTTP referrer restrictions and list domains.

    • Server-side APIs: Use IP address restrictions for backend servers.

  3. Verify enablement and billing status of required Google Maps APIs in the Google Cloud Console.

Example Image here:

Important Considerations:

  • Separate API Keys:

    It is recommended to use separate API keys for client-side and server-side interactions with Google Maps Platform APIs to maintain proper security and restriction management.

  • API Enablement:

    Verify that the specific Google Maps Platform APIs you are trying to use are enabled within your Google Cloud project.

  • Billing:

    Ensure a valid billing account is linked to your Google Cloud project, as many Google Maps Platform APIs require billing.

Advanced Scenarios

Bulk Store Uploads and Importing Over 2000 Locations

  • For fewer than 2000 locations: Add server hostname in API key restrictions.

  • For datasets over 2000 locations: Monitor API usage limits and request quota increases in Google Cloud Console if required.


Lost Access to the Google API Key Account or can't find the owner's email?

The owner of a key is private information protected by Google. There is no way for end users to find the owner of a key. If you don't know the owner of a key and you need to make modification or add restrictions to the key, it may be best to create a new API key. You can do that by following the steps here:

Once you have a new API key created you can use it in your project and manage it in the console. This way you will have more control over the key and project and will be able to add restrictions or billing information if necessary

Also please refer to or guide on setting up and enabling the google api's - https://help.roseperl.com/en/articles/11594871-creating-a-google-api

Did this answer your question?