We had an error message on a client’s site that read something like:
“Error: You Google Maps API key needs updating.”
So far so simple, go and generate a new API key which should look a little something like this:
// Note: you will need to replace the sensor parameter below with either an explicit true or false value.
<script src="http://maps.google.com/maps?file=api&v=2&sensor=true_or_false&key=ABQIAAAACFstjnjkgkzkvm89Q7I1ehQ8rLNggDGnTj1_01CfjEtYdR51pBR49BdeA_tqUtwCLMRE-T-IxL4uCg" type="text/javascript"></script>
Despite testing the client insisted this wasn’t working. It turned out that there were two domains a .com and .co.uk.
For each domain you need a different API key. Google provides some good documentation on how to combat this problem, however this worked sporadically and not at all on Internet Explorer, so I tried this bit of javascript (it needs to be placed in an external javascript file)
var address = (window.location.host);
// returns the page url
if (address == "yourwebsitename.com") {
document.write ("<script src='http://maps.google.com/maps?file=api&v=2&sensor=false&key=YourFirstGoogleMapsAPI' type='text/javascript'></script>");
} else {
document.write ("<script src='http://maps.google.com/maps?file=api&v=2&sensor=false&key=YourSecondGoogleMapAPI' type='text/javascript'></script>");
}
Now this all worked fine apart from on Internet Explorer again. This was because:
var address = (window.location.host);
Most browsers return the following string:
yourwebsitename.com
However Internet Explorer returns:
www.yourwebsitename.com
But adding an extra else if statement solved this (and would also work for very other additional domain name if you have more that two).
var address = (window.location.host);
// returns the page url
// condition for first domain name
if (address == "yourwebsitename.com") {
document.write ("<script src='http://maps.google.com/maps?file=api&v=2&sensor=false&key=YourFirstGoogleMapsAPI' type='text/javascript'></script>");
// condition for first domain in Internet Explorer
} else if (address == "www.yourwebsitename.com"){
document.write ("<script src='http://maps.google.com/maps?file=api&v=2&sensor=false&key=YourFirstGoogleMapAPI' type='text/javascript'></script>");
// condition for second domain name in ALL browsers
} else {
document.write ("<script src='http://maps.google.com/maps?file=api&v=2&sensor=false&key=YourSecondGoogleMapAPI' type='text/javascript'></script>");
}