حل Solved مشكلة عدم عمل خرائط جوجل google maps api key not working
حلول جميع مشاكل عدم ظهور خرائط جوجل فى الموقع
المشكلة فى وجود مساحة بيضاء مكان الخريطة او ظهور نص خطا
اقتباس:
Oops! Something went wrong. This page didn’t load Google Maps correctly. See the JavaScript console for technical details.
رغم وضع مفتاح Google Map API بشكل سليم من هنا
https://developers.google.com/maps/d...pt/get-api-key
لكى نتتبع المشكلة يجب الدخول على JavaScript console كما ذكر فى نهاية نص الخطا
فهناك اكثر من سبب لعدم عمل خرائط جوجل داخل الموقع
ولكى تفتح Console من اى متصفح اتبع هذه الحلول
how to open the JavaScript console
وسيظهر لك اين يكون الخطا
https://www.rise.company/forum/image...2017/10/10.png
اليك اشهر الخطاء المعروفة التى قد تواجهك احداها
------------------------------------------------------------------
قبل التعمق فى حلول تلك المشاكل اليك الخلاصة لحل مشكلتك
بعد انشاء مفتاح قم بهذه الخطوة
بان تضيف موقعك باكثر من شكل وايضا اذا كان https قم باضافته ايضا
وسيعمل معك ان شاء الله " مجرب "
https://www.rise.company/forum/image...2017/10/11.png
---------------------------------------------------------
Fix the “This page didn’t load Google Maps correctly” Error Now that you know exactly what is causing the error, you can fix it. Here are fixes for the most common Google Maps API errors shown in the console.
How to Fix MissingKeyMapError MissingKeyMapError means you are not using an API key and will need to sign up for one then configure your website to use it. Websites that started using Google Maps on or after June 22, 2016 require an API key in order for maps to show.
Create a Google Maps API Key Follow these steps to create and implement a free
Google Maps API Key.
- Start Google’s Get a Key process then log into your Google account (or create one).
- Click Agree and continue to create a new project representing your website.
https://www.rise.company/forum/image...2017/10/12.png - Under Accept requests, add the two entries below (replacing yourname.com with your own domain). Type the first entry then hit enter on your keyboard to add it. Repeat to add the second entry. Having both entries (with asterisks) will help ensure your maps work on any URL of your website. yourname.com/*
*.yourname.com/*
https://www.rise.company/forum/image...2017/10/11.png
- Click Create then copy your key that is now shown on the screen.
https://www.rise.company/forum/image...2017/10/13.png - If you’re using our WordPress plugin, go to Settings > Church Content and paste your key into the Google Maps API Key field then click Save Changes. Otherwise, do similar according to the product you’re using.
https://www.rise.company/forum/image...2017/10/14.png
Note: Google says it can take up to 5 minutes for your key to become active. We’ve heard reports of it taking 30 minutes or longer. Keep this in mind if your maps do not show right away.
How to Fix RefererNotAllowedMapError RefererNotAllowedMapError is the most common error we’ve seen apart from not using a key. The console will also say, “Your site URL to be authorized”. It relates to Step 3 above when creating your key. Here’s how to fix the error.
- Go to https://console.developers.google.com/apis/credentials
- Click your API key’s name to edit its settings.
- Under Accept requests, make sure you have the two entries below (replacing yourname.com with your own domain). Type the first entry then hit enter on your keyboard to add it. Repeat to add the second entry. Having both entries (with asterisks) will help ensure your maps work on any URL of your website. yourname.com/*
*.yourname.com/*
https://www.rise.company/forum/image...2017/10/15.png
- Click the Save button then wait a few minutes for the change to take effect (Google says it can take up to 5 minutes).
Tip: If you have multiple projects, make sure you are working with the correct one by using the dropdown at the top-right.
How to Fix ApiNotActivatedMapError Google Maps has 16 different API’s at the time of writing. Yes, I said sixteen! The Google Maps JavaScript API is the most popular. Whichever API you are using, it’s possible that it is not enabled in your account. Let’s fix the
ApiNotActivatedMapError error by enabling the API you’re using.
- Go to https://console.developers.google.com/apis/library
- Under “Google Maps API’s”, click “More” to see all API’s.
https://www.rise.company/forum/image...2017/10/16.png - Click the API you’re using. Our themes use the Google Maps JavaScript API and Google Maps Static API. Your product may use something different but the JavaScript API is most common.
- Click the Enable button at the top and wait a few minutes for the changes to take effect (Google says changes can take up to 5 minutes).
https://www.rise.company/forum/image...2017/10/17.png - Repeat for other API’s you’re using (remember, our themes use the Google Maps JavaScript API and Google Maps Static API).
Tip: If you’re using a different product than ours, you may need to enable a different API. If you’re unsure which API to enable, you can try enabling all of them (or ask your provider).
How to Fix InvalidKeyMapError InvalidKeyMapError simply means the key you implemented is wrong. In other words, you created it but did not enter it into your website correctly.
- Go to https://console.developers.google.com/apis/credentials
- Copy your key.
https://www.rise.company/forum/image...2017/10/18.png - If you’re using our WordPress plugin, go to Settings > Church Content and paste your key into the Google Maps API Key field then click Save Changes. Otherwise, do similar according to the product you’re using.
https://www.rise.company/forum/image...2017/10/14.png
How to Fix Other Errors This guide covers the errors we’ve seen most commonly. There are other errors. To learn there causes and how to fix them, see the Google Maps API
Error Messages documentation.
It’s Still Not Working Here are three things to check if you are still seeing the “This page didn’t load Google Maps correctly” error.
- Wait five minutes. Google says it can take up to five minutes for the changes to take effect. I have heard that it can take up to 30 minutes in some cases, but give it at least five minutes.
- Check the console again. Revisit the section above on identifying the cause of the error. It is possible that you had two errors to begin with but only solved one or that the one error remains because you did not tweak the settings correctly.
- Clear your cache. If you’re using a caching plugin, purge it’s cache. Otherwise, your key might not be used right away. It doesn’t hurt to clear your browser cache either.
المرجع :
https://churchthemes.com/page-didnt-...llowedMapError
