Google Maps API with key not working on Domain - google-maps

i tried to set up a simple map: http://pan-american.ch and keep getting the same error in the JS Console:
https://developers.google.com/maps/documentation/javascript/error-messages#referer-not-allowed-map-error
Your site URL to be authorized:
on this Domain http://map2.codedesign.ch the key works fine.
so my question is - where can i add Domains...

You want to setup the referrers to allow http://pan-american.ch.
See the Google Documentation on Setting up API keys:
Setting up API keys
If your client application does not use OAuth 2.0, then it must include an API key when it calls an API that's enabled within a Google Cloud Platform project. The application passes this key into all API requests as a key=API_key parameter.
To create your application's API key:
Go to the Cloud Platform Console.
From the projects list, select a project or create a new one.
If the API Manager page isn't already open, open the menu Gallery Menu and select API Manager.
On the left, choose Credentials.
Click Create credentials and then select API key.
Choose the type of key to use. (API key types are described in more detail in the following sections.) If you're unsure whether an API key is appropriate for the API you're calling, select Help me choose and follow the instructions to pick the right credentials.
Note: In addition to reading the instructions on this page, be sure to read Best practices for securely using API keys.
The API supports several types of API keys, including server keys, browser keys, iOS keys, and Android keys.
Browser keys
Create and use a Browser key if your application runs on a client, such as a web browser. To prevent your key from being used on unauthorized sites, only allow referrals from domains you administer.

Related

Securing Google Maps API Key

From 11th June it looks like an API key will be required on the Javascript V3 API.
This is a great change but actually causes a problem that I cannot see a workaround to.
Many sites we work on, we create an API key and then set some HTTP referrer restrictions as recommended by Google. Again this is fine and works great for 99% of our customers.
We have a customer though that has some IOT devices with an embedded web server on board. One of the pages includes a Google Map to display some content about the local area and some sensor data it is picking up locally. At the moment they are using the keyless access to enable this to work.
The trouble comes though when a key gets added. It cannot be restricted to an HTTP referrer at all as these devices could have a seemingly unlimited combination of hostnames and/or IP addresses that the users access these devices on. For it to work no HTTP referrers could be set. However...! This leaves that API key open to abuse.
Are there any solutions for this kind of deployment that is not open to abuse or is there a way of hiding the API key?

Google maps API key HTTP restriction causes 403 error in geocoding API

I receive a 403 error in google maps API dashboard for the geocoding API after limiting the key to my domain. The geocoding works when the key is unrestricted. Currently I have the following as acceptable HTTP referrers:
https://website.com/*
https://www.website.com/*
This allows my basic javascript map and autocomplete forms to work on HTML pages. However, the geocoding is done through a python script that accesses website.com/markers (has no HTML page, just displays JSON data if you visit it). Is there a reason it will not work? The 403 error is what I see in the API dashboard, but I receive an internal server error message when visiting website.com/markers. When unrestricted, the dashboard shows response code 200 and I can see the correct JSON data. Therefore, I believe my code is not the issue.
Things I have tried:
Allowing “https://website.com/markers” as a referrer, as well as www. version of that, and http versions. Also used versions without http or https.
Changing to allow IP address of website (referrer not allowed error happens when I do this)
Double checking all references to API key in code. Code works in development and in production when unrestricted.
Double checked that all needed services are enabled in Google api console and not over quotas.
I have searched for this issue for hours and cannot find an answer, please go easy on me if I have overlooked something simple.
It sounds like you're trying to use the method of URL restriction intended for use with client-side web api's. In that case, the public URL of the site is used in the validation.
You want to use the IP address validation, intended for server-side calls.
The following is from https://developers.google.com/maps/faq#keysystem:
API Key: An API key is a unique identifier that you generate using the
Google API Console. API keys are generally used with the standard
APIs. Premium Plan customers1 typically can choose to use a client ID
or an API key. You can choose to use an API key without applying
restrictions (called a “generic API key”) or a key with restrictions
applied for greater security. APIs in any platform may use a generic
API key.
You can optionally add a restriction (for example, IP address) to the
API key. Once restricted, a key will only work on platforms that
support that type of restriction. Four types of API key restrictions
are available:
IP addresses (individual servers) - for use with the web service APIs.
HTTP referrers (web sites) - for use with the Web APIs.
Android app restriction (by package name and fingerprint) - for use with the Android APIs.
iOS app restriction (by iOS bundle identifier) - for use
with the iOS APIs.
You need a different key for the webservices. You can't apply both HTTP and IP restrictions on the same key. You need HTTP Restrictions on your Google Maps Javascript API v3 key and IP Restrictions on your web service key.

Cordova google map key api error

I have a cross-platform app with cordova , but now the google map is not working.
I have this error :
MissingKeyMapError
I try to create new api browser key in google console with "*" authorization url , but still not working. i have this error : RefererNotAllowedMapError
the window.location.href of my app is :file:///Users/bahri/Library/Developer/CoreSimulator/Devices/757EE924-9884-44B1-B‌​BF5-04CFF3D68C80/data/Containers/Bundle/Application/820BF808-DFF7-4AB0-8BF8-179D2‌​78E90D5/com.taxiwink.taxiwinkapp.app/www/index.html
How can I resolve this issue?
As per today (15 Jul 2020) the following http referrers allows to show a Google map in a cordova app:
iOS:
__file_url__//var/containers/Bundle/Application/*
__file_url__//private/var/containers/Bundle/Application/*
(credit to yannisalexiou for having added the last one which works from iOS13)
Android:
__file_url__//android_asset/www/index.html#/*
__file_url__//android_asset/www/index.html
cordova simulate (eg: simulate ios --target=chrome)
127.0.0.1
localhost
the referrers go into the Google Console API management (API-Project, credentials, referres) at:
https://console.cloud.google.com/apis/credentials/key/abcxyz?project=api-project-123456
NOTE: developed from the answers here https://github.com/wevote/WeVoteCordova/issues/55
MissingKeyMapError Error
The script element that loads the API is missing the required authentication parameter. If you are using the standard Maps JavaScript API, you must use a key parameter with a valid API key. If you are a Premium Plan customer, you must use either a client parameter with your client ID or a key parameter with a valid API key.
See the guide to API keys and client IDs.
From :
https://developers.google.com/maps/documentation/javascript/error-messages#deverrorcodes
https://developers.google.com/maps/documentation/javascript/get-api-key
Also:
Registering authorized URLs
To prevent a third party from using your client ID on their own website, the use of your client ID is restricted to a list of URLs that you specifically authorize.
To see the URLs you have already authorized or to authorize additional URLs:
Log in to the Google for Work Support Portal.
In the left-hand menu, click Maps: Manage Client ID.
You can add up to 100 URLs at a time, to a total of 3000 URLs. If you require higher limits, please contact support.
HTTP and HTTPS protocols are considered different URLs.
For example, if https://example.com is authorized, http://example.com is not necessarily authorized. If you'd like to authorize both at once, you may add a domain without using a protocol: example.com/
You should empty the list of authorized HTTP Referers for your key, in the API Console. This should make the map succeed (after a 5-min propagation delay).
Related issues (it's suggested to "star" them to get an update on their resolution):
Support API key restrictions with file:// referers
Google Maps
API error: MissingKeyMapError when loading from file://
UPDATE
Good news, now you can use file:/ referrers. You can see the following text in the documentation
file:// referers need a special representation to be added to the Key restriction. The "file:/" part should be replaced with "__file_url__" before being added to the Key restriction. For example, "file://path/to/" should be formatted as "__file_url__/path/to/*". After enabling file:// referers, it is recommended you regularly check your usage, to make sure it matches your expectations
https://developers.google.com/maps/documentation/javascript/get-api-key#key-restrictions

Google Maps API must now use a Server Key?

My website makes use of Google Maps API. I recently received an email from Google that says that I should switch from a Browser Key to a Server Key in order to continue using the API past 2 Dec 2015.
So if I am not mistaken all I have to do is request a Server Key in the Google Console and put it in place of my Bowser Key? is that simple?
Here is part of the email:
Yesterday, we announced a pay-as-you-go option for seven of the Google
Maps API Web Services for free, external, publicly available websites
and mobile implementations. As part of this launch, we are tightening
security around how developers identify their usage of the APIs. You
are receiving this email because you may be affected by this change.
Starting today we have deprecated usage of 'Keys for browser
applications' or 'Browser keys’ with the Google Maps API Web Services.
Developers should instead use ‘Server keys’ with these services. Any
newly created browser keys will not work, but existing browser keys
will continue to work for 90 days starting today. On 2nd December
2015, we will be completely disabling usage of browser keys to access
Google Maps API Web Services, at which point any requests to Google
Maps Web Services APIs using such keys will begin to fail.
Currently, in my HTML I have the following that loads the Google Maps API:
<script scr="https://maps.googleapis.com/maps/api/js?v=3&signed_in=false&key=MY_BROWSER_API_KEY&sensor=false"></script>
In another page in the same website, I use the YouTube Data API in the server side to which I feed the SERVER_KEY I obtained from Google Console.
The code looks like:
require_once 'google-api-php-client/src/Google/autoload.php';
$client = new Google_Client();
$client->setDeveloperKey(GOOGLE_API_SERVER_KEY);
$youtube = new Google_Service_YouTube($client);
Yes, all you have to do is change out the key. There are complications with white lists, that may or may not affect people. The white lists between server and web keys need to be merged. This is a problem if the server does not send outgoing communications with the same ip address everytime. For example, for my company, our set up is a group of instances that get dynamically assigned ips from a public pool. In our case we are going to add an extra network interface.
So a better answer to your question is depending on whether you only use the key in a public webpage, or if you use it on a server. If you use the key on a server, and the key is connected to a paid google account for a specific map api service, then you will have to figure out the outgoing ip address(es) and add each one to the list.
A lot of people, particularly on shared hosting accounts have not white listed the server ip as until now, as it could be hidden and the risks of people pirating the key were minimal. But now, in the next 90 days, a lot of private server keys are going to be publicly exposed when people also have to put the key in their html. This will probably mean that there will be a mini migration from shared hosting to more controlled environments, in my opinion.

How to register Google Maps API key for a client's domain I don't own?

I have a website I developed for a client. One of the pages displays a list of street addresses, for which I also have LAT/LONG data. The client requested to add a little map next to this list with a marker for each address.
I would like to use Google Maps API v3, but I have a problem registering client's internet facing URL, which has a form of "ip address:port" (i.e. something like http://123.45.67.89:555) and which I - naturally - do not own and do not have domain admin access. Likewise, their domain admin - whoever s/he is - does not and will not have access to my Google API project for which I'm trying to register the key.
So far I was able to register the client id for local development in a form of http://localhost:5555, but when I'm trying to add the client's URL I'm getting an error
OAuth 2 redirect URL "http://123.45.67.89:555" is invalid.
I searched for solution for this problem and found a suggestion to whitelist the URL in the Google API Console. Yet when I'm trying to add this URL to approved domain list ("notification endpoints") I'm only getting another error:
You do not have access to the following domain:
http://123.45.67.89:555
which is, of course, true. The documentation also says I cannot register a domain I don't own.
So, my question is: how do I register a Client ID for Google Maps API V3 for the client's URL to which I don't have domain admin privileges and whose domain admin doesn't have access to my API project?
Thank you!
Nikolai
You can create a view of the table (File | Create View ...) and own the view (https://support.google.com/fusiontables/answer/171206?hl=en) - thus enabling you to have your own version of the table which is in sync with changes.
As a footnote remember to deal with Cross Origin Resource Sharing (CORS) in your API project by using JSONP for example (https://developers.google.com/storage/docs/cross-origin).
If your are using Google Maps API v3, there is no need to use Google API Key. Simply use below script.
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>