Here’s a quick, step-by-step way for the merchant to check the browser console for the “enable billing” error on the Store Locator page:
Open the Store Locator page
Go to the exact Store Locator URL you configured in the app settings.
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.
Go to the Console tab
If you don’t see it, click the “»” chevron and choose Console.
Reload the page with the Console open
Press Ctrl/⌘ + R so all initialization messages appear.
Look for red error lines:
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|https://console.cloud.google.com/project//billing/enable]
Learn more at [https://developers.google.com/maps/gmp-get-started|https://developers.google.com/maps/gmp-get-started|smart-link]
Places API error: BillingNotEnabledMapError
[https://developers.google.com/maps/documentation/javascript/error-messages#billing-not-enabled-map-error|https://developers.google.com/maps/documentation/javascript/error-messages#billing-not-enabled-map-error|smart-link]
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.
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.
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/*
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.
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
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