Карты Google внутри iframe не загружаются

Question

У меня возникла странная проблема, и я не знаю, в чем проблема. Следующий код JQuery является упрощенной версией того, что я хочу добиться:

var iframe = $('<iframe />'); 
iframe.prop('src', 'https://maps.google.com/maps?q=London&hl=en&sll=37.0625,-95.677068&sspn=46.677964,93.076172&t=h&hnear=London,+United+Kingdom&z=10'); 
iframe.appendTo($('body')); 

// When the iframe loads: 
iframe.load(function() { 
    alert(1); 
}); 

карта никогда не загружена, и load() события никогда не срабатывает. Chrome сообщает следующее сообщение об ошибке:

Refused to display 'https://maps.google.com/maps?q=London&hl=en&sll=37.0625,-95.677068&sspn=46.677964,93.076172&t=h&hnear=London,+United+Kingdom&z=10' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

Как один перепускной это?

Вот jsFiddle demo.

Answer 1

Добавление &output=embed в конец URL-адреса устраняет проблему.

Answer 2

Убедитесь, что вы включили google maps embed api в дополнение к API мест.

Сформировать вы карту здесь:

https://developers.google.com/maps/documentation/embed/start

Answer 3

По состоянию на 2014 год, вариант &output=embed больше не работает. Google предлагает вам перейти на Google Maps Embed API. Вот Quick Start.

В принципе, новая ссылка IFrame является:

https://www.google.com/maps/embed/v1/place?key={BROWSER_KEY}&q={YOUR_ADDRESS_ENCODED} 

Не забудьте включить Google Maps API Встроить в API консоли.

p.s. проверил работает в данный момент я пишу этот ответ