I already registered my project with Google to get an API_KEY.
I already enable the Google MAP API in the API console. See here
I already set the referred to my JSFiddle Account.
[ http://jsfiddle.net/bheng/* ]
Here the link LINK
I am not sure why, it didn't load the map while it should.
What am I doing wrong ?
You are not including the Google Maps Javascript API. Note that you don't need a key (particularly for jsfiddle). Add this to the "External Resources":
https://maps.googleapis.com/maps/api/js
And add JQuery under "Frameworks & Extensions":
http://jsfiddle.net/9wc30ndf/2/
But you need to read the message also (you are missing the "q=")
http://jsfiddle.net/9wc30ndf/3/
You need to use *fiddle.jshell.net/bheng/* as the referrer expression for your browser-API-key since jsfiddle loads the JS sources from this domain (see referer request-header).
Related
I am trying to add google maps Embed API to my site. I keep getting this error:
"The Google Maps API server rejected your request. This IP, site or mobile application is not authorized to use this API key."
The API key is correct. I have Static Map turned on. Two of the most common trouble shots.
Code is formatted as follows:
<iframe
width="600"
height="450"
frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/place?key=XXXXXXXXXXXXXXXXXXXX&q=Space+Needle,Seattle+WA">
</iframe>
I put the < infront of iframe in my code. Any help would be great. Thanks!
Any one have any suggesions?
Static Maps and the Embed API are different things and controlled differently. Do what the message suggests (in its round about way) and turn on the Embed API in the Google API console.
Google Maps Embed API
Static Maps API
I found that the placeholder in Google's HTTP referrers inputs of <https (or) http>://*.example.com/* are misleading, because it suggests that the whole <https (or) http> thing is parsed as some actual "or" statement. In reality, it is not.
You must specify your protocol exactly, such as https://*.example.com. And, if you need support for both protocols, you must specify them as unique rows.
Hope that helps someone out there.
I am creating an app that uses google map. i inserted the map api key inside the html page.
<script type="text/javascript" src="https://maps.googleapis.com/maps/api /js?key=AIzaSyDcvUkjiKRkJ2zV8cYElZy55JLZDjiL9g8&sensor=false"></script>
i keep getting error saying " Google has disabled use of the Maps API for this application. The provided key is not valid Google API key, or it is not authorized for google Maps Javascript API v3 on this site ". i just followed whatever they had mentioned in here
https://developers.google.com/maps/documentation/javascript/tutorial#api_key
i don't have any problem when run this code in my html. Only problem is that some of the map page don't render out properly. Which version is better to use V2 or V3 ?
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
i am kinda confused. Can someone help me out what i doing wrong or what do i need to do. Since my app is totally based google map. Thanks
I see two possibilities for you:
Either you use this line in your code <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=CHANGE_YOUR_KEY_HERE&sensor=false"></script> and you generate a new key for you application: https://developers.google.com/maps/documentation/javascript/tutorial#api_key
(on the screenshot you can see the link "Generate new key...")
Or you use this line without bothering with having a key. (for example: http://jsfiddle.net/LZmQ2/)
I have a form on my website which forwards the textbox input to www.google.com/search?q=.... Is there any possibility to get this autocomplete / autofill features google provides when searching over google.com. Firefox uses google's autocomplete function in the search bar next to the url bar, but how can I get this kind of information for my web form?
There was the Google Suggest API that allowed to use autocomplete on custom keywords. But it seems google has removed it. But I found out that you can still access the API. There are URLs for JSON and XML.
JSON
http://clients1.google.com/complete/search?hl=en&q=<your query here>&client=hp
XML
http://clients1.google.com/complete/search?hl=en&q=<your query here>&output=toolbar
Without any warranty.
If you want to get autocomplete on a text box. You can combine that with jQuery UI Autocomplete
Here an complete example with google auto suggest
http://googlesuggest-jquery.googlecode.com/svn/trunk/
The new url is:
http://suggestqueries.google.com/complete/search?client=firefox&q=YOURQUERY
the client part is required; I did't test other clients.
In addition to RickyA´s answer you can filter the suggestion by media using bs parameter:
http://clients1.google.com/complete/search?hl=en&q=stackoverflow&output=toolbar&ds=
youtube: ds=yt
books: ds=bo
products: ds=sh
news: ds=n
images: ds=i
web: ds=
recipes: ds=r
Looking at the developers guide for the Google Maps Javascript API v3 it explains first about how to obtain an API, then shows examples of including that key in the HEAD section of an HTML page e.g.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map_canvas { height: 100% }
</style>
<script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=SET_TO_TRUE_OR_FALSE">
</script>
Is there any need to keep this key secret, given it is used for rate-limiting and suchlike? In particular I'm thinking about if I put my work onto something public such as GitHub, do I need to remove my API_KEY before committing?
Is the answer in configuring within the google API settings that the key is only valid if it the webpage the key is within has been served from a domain name that I control?
UPDATE - was using:
http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=SET_TO_TRUE_OR_FALSE" from Google tutorial linked above. Removed the api-key and all seems to work fine. Am confused about the Google tutorial telling me I need to use it though...
V3 doesn't require a key, but there are some benefits to using one.
Note first off that this key is different than the old V2 key. It's generated from the APIs console (http://code.google.com/apis/console). You pass it the same way, with a key parameter when loading the JS.
Benefits of having a key include usage reports in the console, and a way for Google to contact you if you're going over the quota regularly. You can also purchase additional quota through the console. Finally, if you're using the Places API, it requires the use of a key.
You can set allowed referrers, so that your key can't be used by others.
What Frazell says is correct, when you receive your api key on the right is a 'Edit allowed referers...' link that pops up an option to allow the websites you want to show your map on, if you leave this blank you are allowing any, but if you set let's say http://yourdomain.com only that domain can display the map.
No secrets here. When the key is generated it is associated with your domain name, so the key will not work on someone else's site anyway. It's your and yours alone.
(I agree with Marc's comment)
According to http://code.google.com/apis/maps/signup.html, version 3 does not need a key. "The Google Maps Javascript API Version 2 has been officially deprecated as of May 19, 2010. Version 3 does not require an API key."
You should keep your API key private and not share it publicly, via GitHub or any other means. You can place it in a configuration file that loads the value in later and keep that file outside of GitHub, for instance.
I noticed that I am unable to load the google maps js libraries using labjs. I.e.
$LAB.script("//maps-api-ssl.google.com/maps/api/jslibraries=geometry&v=3&sensor=false").wait()
is not working for me (library is not available in my code) and I have to explicitely do
<script src="//maps-api-ssl.google.com/maps/api/js?libraries=geometry&v=3&sensor=false"></script>
Any idea why?
LAB.js can load Google Maps as long as you include a callback parameter, e.g.
window.noop = function() {};
$LAB.script("//maps-api-ssl.google.com/maps/api/jslibraries=geometry&v=3&sensor=false&callback=noop").wait()
Two urls are not the same. Did you check it?