gmaps icon indicating copy to clipboard operation
gmaps copied to clipboard

Where to put reference to Google API Key?

Open Byter-Bit opened this issue 8 years ago • 3 comments

Where to put a reference to Google's API Key?

Also: tests show me Google behaves differently if the call is from a named server or an IP address. From an IP address, no problems; from a named server I get “Oops! Something went wrong.” Let’s assume they are more strict on what they see as commercial operations.

Back to “Where do I put the key?”
I had an nicely working app written two years ago. I found time today to buy a domain and set it up, discovering this issue. I got myself a key and tried putting it in at line 1694 of a two year old gmaps.js as in

GMaps.staticMapURL = function(options){ var parameters = [], data, // static_root = (location.protocol === 'file:' ? 'http:' : location.protocol ) + '//maps.googleapis.com/maps/api/staticmap'; static_root = (location.protocol === 'file:' ? 'http:' : location.protocol ) +'https://maps.googleapis.com/maps/api/js?key=AsXxxxxxxxxxxxxxxxxxxxxxxxxxxxC8c&callback=initMap';

Needless to say it did not work. I’m not god’s gift to JS programmers and could use some help as to where to use it in the old or new code. Many thanks -

Byter-Bit avatar Feb 09 '17 22:02 Byter-Bit

@Byter-Bit

image

More info here: https://developers.google.com/maps/documentation/javascript/tutorial

Fleeck avatar Feb 13 '17 10:02 Fleeck

@Fleeck, @Byter-Bit has made a good note, he's not mentioning a script request, but a static img url request. When requesting an img, according to the documentation here and also to the common error messages here, the API key must be included, and GMaps's gmaps.static.js is not inserting it, generating errors after some user requests. I'm experiencing that myself right now.

More info to read about it here if needed.

I'll try to just add an '&key=' + my_gmaps_key to the static map url to see if it solves, like this (example):

var static_map_url = GMaps.staticMapURL({
    lat:     your_lat,
    lng:     yout_lng,
    markers: [{
        lat: your_lat,
        lng: your_lng
    }],
    zoom:    zoom,
    size:    [507, 396]
});
static_map_url += '&key=' + google_maps_key;
$('<img/>').addClass('img-responsive')
           .attr('src', static_map_url)
           .appendTo('body');

Hope to have helped someone somehow.

Another note, it's important to enable request to the static gmaps api here, otherwise it won't work.

Keep this issue opened 'till someone improves that file.

giovannipds avatar Apr 24 '17 22:04 giovannipds

REPLACE

WITH

ifin2000 avatar Sep 07 '18 10:09 ifin2000