1

我的谷歌地图在我的网站上运行良好：

<iframe id='iframe1' src="https://maps.google.com/maps?q=25.1954875,-111.6649204&hl=fa;z=14&ie=UTF8&amp;output=embed&hl=en"></iframe>

我应该改变它，因为 GTmetrix。所以我决定在页面加载时加载它，这是我不加载地图的新代码。

 <iframe id='iframe1' ></iframe>

    <script>
        window.addEventListener("load", function() {
            document.getElementById('iframe1').src = 'https://maps.google.com/maps?q=25.1954875,-111.6649204&hl=fa;z=14&ie=UTF8&amp;output=embed&hl=en';
        });
    </script>

注意：这是我对 Gtmetrix 的问题，只是分享以完成我的问题：

有 5 个静态组件没有遥远的到期日期。

https://maps.googleapis.com/maps/api/js?client=google-maps-embed&paint_origin=&libraries=geometry,search&v=3.exp&language=fa&callback=onApiLoad https://maps.googleapis.com/maps/api /js/StaticMapService.GetMapImage?1m2&1i10787022&2i6603899&2e1&3u16&4m2&1u543&2u300&5m5&1e0&5sfa&6sus&10b1&12b1&client=google-maps-embed&token=64085 https://khms1.googleapis.com/kh?v=862&hl=fa&x=5267&y=3224&z=13 https://maps.googleapis.com/maps /api/js/ViewportInfoService.GetViewportInfo?1m6&1m2&1d35.71592679292299&2d51.45263317535978&2m2&1d35.73212757327154&2d51.488170370963076&2u16&4sfa&5e0&6sm%40496000000&7b0&8e0&11e289&callback= xdc ._ng5r7i&客户端=谷歌地图嵌入&令牌=4563 https://maps.googleapis.com/maps/api/js/ViewportInfoService.GetViewportInfo?1m6&1m2&1d35.71552264420163&2d51.46028412421049&2m2&1d35.73193943495472&2d51.48040793223049&2u13&4sfa&5e2&7b0&8e0&11e289&callback= xdc ._iyqfq0&client=google-maps-embed&token=32784

有 1 个重定向

https://maps.google.com/maps?... redirects to https://www.google.com/maps/embed?...
4

1 回答 1

4

使用您的代码：

 <iframe id='iframe1' src="about:blank"></iframe>
 <script>
   window.addEventListener("load", function() {
     document.getElementById('iframe1').src = 'https://maps.google.com/maps?q=25.1954875,-111.6649204&hl=fa;z=14&ie=UTF8&amp;output=embed&hl=en';
   });
 </script>

javscript 控制台中有一条消息：

Refused to display 'https://www.google.com/maps?q=25.1954875,-111.6649204&hl=fa;z%3D14&ie=UTF8&amp;output=embed&hl=en' in a frame because it set 'X-Frame-Options' to 'sameorigin'.

但是，如果<iframe>也是动态创建的，它可以工作（请注意，源是在附加到 DOM 之前设置的）：

 <script>
   window.addEventListener("load", function() {
     var iDiv = document.createElement('iframe');
     iDiv.id = 'iframe1';
     iDiv.src = 'https://maps.google.com/maps?q=25.1954875,-111.6649204&hl=fa;z=14&ie=UTF8&output=embed&hl=en';
     document.getElementById("anchor").appendChild(iDiv);
   });
 </script>

代码片段：

<div id="anchor"></div>

<script>
  window.addEventListener("load", function() {
    var iDiv = document.createElement('iframe');
    iDiv.id = 'iframe1';
    iDiv.src = 'https://maps.google.com/maps?q=25.1954875,-111.6649204&hl=fa;z=14&ie=UTF8&output=embed&hl=en';
    document.getElementById("anchor").appendChild(iDiv);
  });

</script>

于 2020-01-03T21:51:29.583 回答