28

What I have is a Google map that shows the location of a property but when I come to print the dynamic maps dont print so good so I decided to implement the Google Static Map image API.

http://lpoc.co.uk/properties-for-sale/property/oldgate-dairy-st-james-road-long-sutton-cambridgeshire-pe12/?prop-print=1

^^ is an example of a property in print view and should show a static map image but it fails to load and looking at my inspector I'm getting a 403 Forbiden response for the image.

But if I go to the URL directly the image loads...

What am I doing wrong?

Thanks

Scott

Improve this question

11 Answers 11

Reset to default
18

This has gotten quite a lot of views, so I'm adding my solution to the problem here:

When using the new API, make sure you generate a Key for browser apps (with referers) and also make sure the patterns match your URL.

E.g. when requesting from example.com your pattern should be

  example.com/*

When you're requesting from www.example.com:

  *.example.com/*

So make sure you check whether a subdomain is present and allow both patterns in the developer console.

  1. Visit the Developer Console.
  2. Under API Keys, click the pencil icon to edit.
  3. Under "Key restrictions", ensure that you have an entry for example.com/*, *.example.com/*, and any local testing domains you might want.
Improve this answer
4
  • 2
    This is exactly what helped me! I spent whole weekend with that issue. Newest static maps api, right URL, I am sending api_key, api console told me "no problems" - and I was getting only error 403 forbidden by Google. Finally I found your advice and bingo! :) I've just added mydomain.com/* to api console and it works like a charm! Thank you :)
    – Kamil B.
    Commented Mar 30, 2014 at 19:00
  • 3
    Also remember to add localhost/* if you want it to work on localhost
    – jackocnr
    Commented Jan 27, 2015 at 17:59
  • Is it possible to edit a project in the developer console, or do you have to delete the current one and add another?
    – jenlampton
    Commented Mar 22, 2017 at 2:36
  • I was eventually able to edit a project, but only from this URL: console.developers.google.com/apis/credentials/key
    – jenlampton
    Commented Mar 22, 2017 at 2:52
14

There seems to be some confusion here, and since this thread is highly ranked on Google, it seems relevant to clarify.

Google has a couple of different API's to use for their maps service:

Javascript API

The old version of this API was version 2, which required a key. This version is deprecated, and it is recommended to upgrade to the newer version 3. Note that the documentation still states that you need a key for this to function, except if you're using "Google Maps API for Business".

Static Maps API

This is a whole different story. Static maps is a service that does not require any javascript. You simply call an url, and Google will return a maps image, making it possible to insert the URL directly into your <img> tag. The newest version is version 2, and this requires a key to function because a usage limit is applied.

A key can be requested here: https://code.google.com/apis/console

And the key should be added to the request for the correct image to be generated:

http://maps.googleapis.com/maps/api/staticmap?center=New+York,NY&zoom=13&size=600x300&key=API_console_key

I hope this clears up some confusion.

Improve this answer
1
  • I dunno if this has changed since your answer, but according to the static maps API v2 a key is not required. quoted from the site: "Note that the use of a key is not required, though it is recommended. Examples in this document do not include the key parameter so that they will work for all users who cut-and-paste the code."
    – Pure Function
    Commented Apr 16, 2013 at 8:51
4

I had this same problem but my solution was different. I had the V2 maps api enabled, but not the static maps api (I thought this was V2). I enabled the static maps api and it worked.

Improve this answer
1
  • 1
    This worked for me. In the Google APIs console I had enabled "Google Maps API" but not "Static Maps API", which is near the bottom of the list.
    – Ryan Wheale
    Commented Dec 12, 2013 at 7:14
3

Be hundred percent sure of these points: (for static maps)

  1. Enable your project at this url :

https://console.developers.google.com/apis/api/static_maps_backend/overview?project=

  1. You have your localhost, staging and production - all urls with wildcards enabled in the referrer section.

  2. Google has changed its policy and you now need an api key to display maps. refer this for more : Google Maps API without key?

Hope it helps.

Improve this answer
2
  • What do you mean by "the referrer section"? As best I can tell, a "project" consists of only a name - there's nothing in the UI to tie a project to a particular website.
    – jenlampton
    Commented Mar 22, 2017 at 2:46
  • Update: "the referrer section" is located under "Credentials", and you can only enter specific domains (with wildcards) once you add "Key restriction" via "HTTP referrers (web sites)"
    – jenlampton
    Commented Mar 22, 2017 at 2:51
2

Oops I feel like such an idiot. I was using the old V2 maps API URL and not the new V3 API URL. I was getting a 403 because I was using the V2 URL without providing an API key :(

Improve this answer
2
  • 7
    But even so, how comes that you get 403 when loading from an img tag, and it works when loading directly in the browser?? I have the same issue
    – matteo
    Commented Dec 8, 2011 at 20:18
  • 11
    And by the way, what V3 api url???? According to the documentation, there no such a thing as a static map api V3, the latest version for static map api is V2. I'm confused
    – matteo
    Commented Dec 8, 2011 at 20:23
2

Staticmaps V3 doesn't need the "Key" attribute and removing it seems to solve the <img> source problem.

Try with an URL like this:

http://maps.googleapis.com/maps/api/staticmap?center=0.0000,0.0000&zoom=13&size=200x200&maptype=roadmap&markers=0.0000,0.0000&sensor=false

For more information read this.

Improve this answer
1
  • I know this answer is old but future readers note that the linked doc states "This document details the Maps Static API v2". It also suggests that a key must be provided: &key=YOUR_API_KEY.
    – contrebis
    Commented Dec 2, 2019 at 17:25
1

Yeah, Google Maps API version 3 were java-script version; "Google Static Maps" latest were 2.0. I suspect there might be some restriction on use.

Improve this answer
1

I could also not display static maps and could see 403 error in the browser's network console.

http response headers:

status:403
x-content-type-options:nosniff

I had an API key with a lot of Google Maps APIs enabled but the Google Static Maps API was missing, enabling it solved the issue.

Improve this answer
1

now you should use 'signature' parameter, which you should add to request - otherwise static maps won't work. here is few useful links

1) how to generate signature

2) how to make signature on BE side (code snippet)

Improve this answer
0

I am using Wordpress 4.9.4 with ChurchThemes Exodus Theme. I had applied for & generated a New API_KEY.

Once that is done your maps should start appearing on your site or app.

If they don't appear on refresh you may need to:

  • clear your cache (Wordpress or Drupal webistes),
  • wait the 5 min recommended for the API to Register the enabled API's
Improve this answer
0

Try enabling billing on this Google Cloud Project/Firebase Project.

I was experiencing this same issue and just received the 403 error in the console. Copying and pasting the Static Maps URL in to the URL bar and loading it showed the following error message:

The Google Maps Platform server rejected your request. You must enable Billing on the Google Cloud Project at 
https://console.cloud.google.com/project/_/billing/enable Learn more at https://developers.google.com/maps/gmp-get-started

Hope this helps!

Improve this answer
1
  • As of this date, this answer led to solving my challenge with a 403. I had billing enabled but did not have the Static API enabled, which activates the billing for this service.
    – TonyG
    Commented Jul 21, 2022 at 17:16

Not the answer you're looking for? Browse other questions tagged or ask your own question.