Custom marker missing ... sometimes - google-maps

We're using the static google maps API and things were going fine when suddenly it started getting hiccups with our custom marker icon. Sometimes it get's displayed as intended, sometimes we end up with the default marker and the yellow banner in the upper right corner stating: "Map error: g.co/staticmaperror".
Taking a look at the headers we found that google seems to have issues fetching our marker image:
x-staticmap-api-warning: Failed to fetch image url https://www.xyz.de/some_image.png
I can fire the very same request n times and get some m <= n responses that are fine and some o <= n requests that have the above mentioned issue. This seems to me like google has some issues caching the image.
I have no issues requesting the marker image from our servers, though. There are no firewall rules that fire. The marker image has a high cache-control max-age and a fine etag, it expires two weeks from now. There's nothing fancy about it.
The maps request looks like this:
https://maps.googleapis.com/maps/api/staticmap?key=<OUR_KEY>&size=260x130&maptype=roadmap&format=png&visual_refresh=true&zoom=10&markers=icon:https://www.xyz.de/some_image.png|52.52008961%2C13.40465566&signature=<SIG>
Nothing fancy here either.
Since SO seems to be the official google support now, may some google techie please help?

As it turns out our application firewall actually blocked some requests from Google and we have to add some more rules. (Although we think we checked that twice already.)
Sadly, there's no fixed IP range for the maps services. But let me share with you what the support told me:
Google Cloud Support
It is not possible to provide a specific list of IP addresses that must be accessible in order to use the Maps APIs, because Google services are not tied to specific hosts or IP addresses in our data centers.
Services are migrated between data centers depending on load, maintenance schedules, and growth. The particular data center that a specific request is routed to depends on the user's geographical location, network location, and the relative load on nearby data centers currently hosting the service concerned, and on the network links that connect them.
If you need to add IP based firewall rules, your only option is to whitelist Google's entire network allocation, which can be obtained using the following command from a Unix system:
$ dig +short _spf.google.com txt
The answer will include some text like:
"v=spf1 include:_netblocks.google.com include:_netblocks2.google.com include:_netblocks3.google.com ~all"
Be sure to follow the includes for all the netblocks e.g.
$ dig +short _netblocks.google.com txt
$ dig +short _netblocks2.google.com txt
$ dig +short _netblocks3.google.com txt
The answer section lists all IP address blocks in CIDR notation.
This list changes several times a year as servers are added and removed, and it is your responsibility to track those changes and update your firewall accordingly. (We recommend that you do so every quarter).
In general it is much easier to set firewall rules based on the list of hostnames used by the Maps API, which is more stable.
Another way to fix this would be to make an exception for this static resource (the marker icon).

It looks like you were affected by this issue that was reported in Google's Issue Tracker about a month ago and has since been fixed.
If you are still getting that "failed to fetch image url" error at times though, I recommend you comment on that bug so that Google techies can look into this further from their side.
Hope this helps!

Related

HTTP 403 on images loaded from googleusercontent.com

First off, I don't think my problem is related to these questions: question 1, or question 2.
Because I'm not using authentication anywhere, or any library either (I don't need to).
I'm simply loading some publicly-available album art images in my web application:
// urlList is an array than contains URLs like the examples given below
<img *ngFor="let url of urlList" src="url">
Example URLs:
Glass Mansion, Summertime, Side Effects
99% of the time, it works. But sometimes I get 403 errors on the console for those exact same URLs.
I know they're not related to authentication, because, well. These URLs are publicly accessible.
Debugging this has been difficult, because a few page refreshes later, it magically works again. There's nothing out of the ordinary in logs either (except the GET 403 errors).
What in the world is happening?
I'm using Angular v7.2.15. Browser: Google Chrome
Add referrerpolicy="no-referrer" attribute
<img src="your-google-link-here" referrerpolicy="no-referrer"/>
Within several Google API's (like the gmail API for example), Google uses HTTP403 and/or HTTP429 in order to ratelimit certain requests over certain time periods. I do not know what method you are using, if you are using some sort of API etc, nor do I know how busy or large your webapp is. But rate limiting or fair use compliance could be coming into play.
Gmail API Rate Limit Info Source - https://developers.google.com/gmail/api/v1/reference/quota

Google Maps API for both localhost & production server, as of April 2019

TLDR
My code works fine on my laptop when accessed as file://<path>/index.html, but neither on my laptop with an Apache server running when accessed as http://<path>/index.html, nor on my real (production) server. I see no errors on the console, but the map is just a grey rectangle.
[Update] I moved to LeafletJS shortly after asking this question, and recommend others to do so too.
It has been a few years since I coded any Google Maps applications.
It seems that, as of last year, it is now necessary to have an API key, by providing it with credit card details, and to provide it with each API call.
Unfortunately, there is a lot of of information about this, much/most of it out of date and/or contradictory.
Can anyone point to the canonical guide, preferably with screenshots, of how to configure this?
I wish to draw a map, and add some makers, which will require reverse geocoding, such that I provide a street address and convert it to lat/long in order to place the markers.
Sounds simple enough, but which of the many thousands of "helpful" site has gotten it right?
For instance, what seems to be the current Google help page speaks of
From the Navigation menu, select APIs & Services > Credentials.
On the Credentials page, click Create credentials > API key
But I can't even see that menu option :-(
[Update] If it helps any, the error message in the developer console said :
Geocoding Service: You must use an API key to authenticate each request to Google Maps Platform APIs. For additional information, please refer to http://g.co/dev/maps-no-account For more information on authentication and Google Maps JavaScript API services please see: https://developers.google.com/maps/documentation/javascript/get-api-key
[Update] I am trying to access the API like this
<script src="maps.google.com/maps/api/…>
and
var url = 'https://maps.googleapis.com/maps/api/geocode/json?address=' + comapnyLocation +'&key=XXXX';
$http.get(url)
[Update++] in the developer console, I see a bunch of errors along the lines of:
aliextension.com/wp-content/uploads/2017/08/JAR.png:1 GET https://aliextension.com/wp-content/uploads/2017/08/JAR.png net::ERR_CONNECTION_TIMED_OUT
I have no idea what aliextension is, nor does it appear in my code (maybe in some minified JS?)
Ok, it is something to do with AliExpress (Ali Baba). I removed it & the timeout messages go away, but I still have problems.
If I load the index.html into Chrome as a file://, then it works just fine. But, if I load it `as http://, where I have a Xampp Apache server running, the map box remains grey, although I see no error messages. The same thing happens on my real server :-(
This page should be your starting point:
https://developers.google.com/maps/documentation/javascript/tutorial
it helps you working with Google map javascript API.
To embedded a google map to your website read the overview page in the above link.
To add markers to your google map read this page:
https://developers.google.com/maps/documentation/javascript/adding-a-google-map
To do reverse geocoding read this page:
https://developers.google.com/maps/documentation/javascript/geocoding
That all i need to work with google map. I think you can do the same too.
The cause for this is quite likely an API key restriction.
In order to permit these host-names or IP addresses, you have to:
a) go to the credentials panel and select the according project, then click on "Api key".
b) there you can loosen the restrictions, for HTTP referrers (for web-sites)
... or for IP addresses (in case these are server-side requests).

Why does google visit my url every time I start chrome?

I've noticed that Google keeps visiting some of my url:s each time i boot up Google Chrome, does anyone know why this might be?
This wouldn't be much of a problem, except that it keeps hitting an login-url for a system I've built. And each time there's an unknown login-call I receive a text message... so, it's kind of annoying.
The IP range i keep receiving this visits from is 66.102.9.*.
Sure, I could block this ip-range. But first I'd like to know why I keep receiving this visits. Does anyone have any ideas?
Perhaps it is your Chrome's starting page and you could change it in the settings.
That's where I'd start, unless you have already checked that.
If that's not it, try the Google Chrome forums
When you use Google Chrome, it sends GET requests to Google's servers for the bowser's update checks and for the Chrome apps updates.
Chrome sends requests to multiple URLs when it’s checking for and downloading updates. The order of requests is determined dynamically at runtime. Both HTTP and HTTPS protocols might be tried. The following URL list of hostnames and paths can change at any time without notice:
www.google.com/dl/*
*.gvt1.com
tools.google.com/service/update2
dl.google.com/*
google.com/dl/*
clients2.google.com
update.googleapis.com/service/update2

How to do getlocation other than by the browser's (W3C) "navigator.geolocation" object?

I know how to use the W3C navigator.geolocation API, but just found out that under Google Chrome it does not work when the page is on the local filesystem rather than on a web server: [1], [2].
What other techniques can I use to get either the latitude and longitude, or the country code for my current location?
(I'm running my project from the local filesystem because ideally it won't require a server of its own. In fact I don't even have my own domain or hosting or such (hitchhiking around the world with my netbook for the past year). It calls web APIs on 3rd party servers but doesn't have its own server.)
(Yes I know I can work around this by running a local web server such as Python's SimpleHTTPServer, but let's assume for this question that such a workaround is not possible.)
If you could turn on cross-domain requests for ajax (such as if you're developing this to run locally on a mobile device) you could make an ajax request to your server and then geolocate the global IP address coming from it. Geolocation is occasionally not accurate (for example, I'm in Utah and my phone's IP comes up in Oklahoma).
You could also redirect the user to a page hosted on another server and do the same thing and then forward them back with the GPS coordinates in the query string.
Both of these are a little ugly, but I don't know really of any way other than geolocation to get GPS coordinates.

Google Maps API Blocked for certain server

Google Maps API static maps is blocking my website's maps.. The site is on a load balancer, so the map is only blocked on one of the servers and seems to be only blocked when viewing the map that was sent in an Email. The users see a red X with a thottle image representing overused.
If I view the map in a browser using the Javascript V3 version of the same map on the same device, it is fine. Or if I end up on another server (load balancer), then it is fine. It is just a specific server viewing an email with the map in the email.
http://maps.google.com/maps/api/staticmap? (example - doesn't work outside of the code)
My question is to try and understand what is happening. When viewing an email with the Static map, it is the end user (receiver of the email) that is downloading the Map. There is no way any of them reached a 2,500 view limit in a day. All the emails come from one server, but when viewing I do not think this is a factor since it is only when I am on a specific web server that I get the problem.
Can anyone explain what is happening?
BTW, I have contacted Google Business Premier group and have not received a response yet. I need a work-around while I figure out what and if they want to charge me.
I'd make sure that you're not embedding the image itself in the email, but instead are including an tag that loads the map directly from Google. If your email blasting program is downloading the image and embedding it in the email you could easily go over that limit based on how many images and emails you send.
It would be worth looking at the HTML source of the email and making sure that you're loading the map directly from Google. If you are, any over quota problems you've run into might be limited to your current IP address. Checking the email from a different IP (simulating one of your end users) should be a much better test.