iframe内的Google地图无法加载
我遇到了一个奇怪的问题，我不知道问题是什么。 以下jQuery代码是我想要实现的简化版本：
var 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演示 。
追加&output=embed到URL的末尾可以解决问题。
截至2014年，选项&output=embed不再起作用。 Google建议您切换到Google Maps Embed API。 这是一个快速入门 。
基本上，新的iframe链接是：
https://www.google.com/maps/embed/v1/place?key={BROWSER_KEY}&q={YOUR_ADDRESS_ENCODED}
请务必在API控制台中启用Google Maps Embed API 。
ps我在写这个答案时检查了工作
除了places API之外，请务必启用google maps embed api。
从这里生成您的地图：
https://developers.google.com/maps/documentation/embed/start