Google maps disappear in FireFox after logging in with Google

Kirklees_College

I have a page with an embedded Google map (iframe). This works fine initially.

However, when I log in using this Socal Login plugin and Google, my maps disappear when viewed in FireFox!
If I copy the iframe source and paste it into a new tab I get the following message:

"We are sorry, but you do not have access to this service. Please contact your domain administrator for access."



Even if I log out, the maps are still missing.

I've traced it to a cookie that is added when logging in with this plugin and Google:
google.com > HSID

If I delete it, the maps come back.

Is there a way around this issue?

Kirklees_College

Hi Frederic,

After further testing, this is what I've found:

1) If not logged into WordPress with Google, the mymaps iframe loads in all browsers
2) If logged into WordPress with Google, using the same account as was used to create the map, the iframe will load in all browsers
3) If logged into WordPress with Google, using a different account as was used to create the map, the iframe will NOT load in FireFox only

I tried adding &output=embed to the iframe source but this didn't work.

I did find this though:
http://stackoverflow.com/questions/15388897/google-maps-inside-iframe-not-loading

It suggests Google have removed the output/embed workaround and now recommend using their Places API to embed a map as an iframe.

I enabled 'Google Maps Embed API' and 'Static Maps API' and changed my iframe src to:
https://www.google.com/maps/embed/v1/place?q=Batley+School+of+Art,+Birkdale+Road,+Dewsbury,+WF13+4H&key=API_KEY_HERE

This seems to have fixed the issue.

Fred_Pinel

Hi,
Thanks for reporting this.
Could you share the code that displays the google map (the iframe) ?
So we can try to reproduce your error.

Thanks.

Kirklees_College

Hi,

Sure, here's an example:
<iframe src="https://www.google.com/maps/d/embed?mid=z7CKlB5eYaDE.kzmUQUv2MCcg&amp;z=16" height="250" width="100%"></iframe>

Thanks
Chris

Kirklees_College

And here's the console error after a successful login:

Timestamp: 18/08/2015 15:44:16
Error: Load denied by X-Frame-Options: https://admin.google.com/ServiceNotAllowed?service=mymaps&continue=https://www.google.com/maps/d/embed?mid=z7CKlB5eYaDE.kzmUQUv2MCcg&z=16&wmode=transparent does not permit cross-origin framing.

Claude_Schlesser

Hi Chris,

could you please post a link to your website?
I will have a look.

Regards,

Kirklees_College

Hi Claude,

The site is still on an internal development server. We hope to go live in the next couple of months.
Is it just me that has the problem?

Chris

Fred_Pinel

Hi,
Your google maps iframe does work on our wordpress test environment.
Do you have a specific configuration directive for your web server?
(such as x-frame-options headers)

regards.

Kirklees_College

Hi,

No, no x-frame options are defined.
The iframe works fine until I've authenticated with Google.

Does the iframe in your test environment still work in FireFox after signing in with Google?

Thanks
Chris

Fred_Pinel

Hi,
Yes, it does work after signing in with Google via Social Login.

Do you notice any error message in the console on the page with maps iframe before signing in (and while not signed in with Google, with or without Social Login) ?

Also, could we access your page somehow? (you mention it is under development)

Fred_Pinel

Hi,

Maybe you can try adding &output=embed to the Maps source link (as per stackoverflow :-).

Also, are you sure a non-public Google Map can be displayed in an iframe? (which would explain the x-frame-option)

regards.

Fred_Pinel

Great, thanks for the detailed answer.