How to Fix Google Maps JavaScript API Error: RefererNotAllowedMapError (Divi)

How to Fix Google Maps JavaScript API Error: RefererNotAllowedMapError

The RefererNotAllowedMapError error in the Google Maps JavaScript API is one of the most common issues that developers may encounter when integrating Google Maps into their websites using Divi or other platforms.

What is the RefererNotAllowedMapError?

This error occurs when the Google Maps API settings are not compatible with the domain where the map is being loaded. In other words, a specific referer is not allowed to access Google Maps due to security restrictions imposed by Google.

Causes of the RefererNotAllowedMapError

• The domain has not been added to the Google Maps API settings in your Google Cloud account.
• Incorrect settings in Divi or any other platform.
• Failure to verify the proper configurations of the API key in your Google Cloud project.

How to Fix the RefererNotAllowedMapError

To resolve this issue, you need to follow some simple steps to adjust your API settings. Here’s how to fix it:

Step 1: Check the API Key Settings in Google Cloud

Log in to your Google Cloud account and go to your project. From there, navigate to API & Services and then select Credentials. Ensure that the key you are using to run Google Maps contains the domain you are working on.

Step 2: Add the Domain in the API Settings

Within the API Key Restrictions settings in Google Cloud, make sure to add your website or application's domain to the whitelist of allowed referrers.

Step 3: Update Divi or your Platform's Settings

If you are using Divi or any other website builder platform, ensure that you have entered the correct API key in the map settings and check that Divi is compatible with the current API key settings.

Step 4: Test the Changes

After applying these changes, reload the page or refresh the app and check if the error has been resolved. If the error persists, make sure that the domains specified in Google Cloud match exactly with what is being used on your site.

Additional Tips for Troubleshooting Other Google Maps API Errors

• Always ensure that you have the latest version of the API key and that it functions properly.
• Check the error logs in the Google Cloud Console to identify any additional potential issues.
• Refer to Google’s official documentation for the latest updates regarding the API and any changes that might affect the operation of Google Maps.