首页 > 解决方案 > 每次页面加载时都会调用谷歌地图的脚本

问题描述

谷歌地图的脚本 src(api key) 应该只在页面加载时加载一次

索引.html

<script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=apikey" async= "true"></script>

.ts 文件

const script = document.createElement('script');
    script.id = 'googleMap';
    console.log(script,'script')
    if (this.apiKey) {
      script.src = 'https://maps.googleapis.com/maps/api/js?key=' +
        this.apiKey;
        console.log(script.src,'script.src')
    }
    else {
      script.src = 'https://maps.googleapis.com/maps/api/js?key=';
    }
    document.head.appendChild(script);

截屏

标签: ionic4

解决方案


如果您已经将 .ts 文件中的片段手动放置在主 html 文件中,那么您在 .ts 文件中有什么用途?

尝试删除它。

如果不是,请提供有关您的const script =...代码段在应用程序中实际位置的更多详细信息。它必须在不止一次被调用的地方?

更新

根据您的评论,您说您已经删除了您发布的脚本示例,但它仍然多次包含它。

这听起来像你没有把你<script>的标签放在你的<head>标签里。如果它在重复的东西里面,那么它就会重复。

如果这不能解决您的问题,那么请改写您的问题以包括更好的片段和更清晰的当前设置,否则我们只能猜测它可能是什么。


推荐阅读