如何修复不支持加载不带回调的GoogleMapJavaScript API

0md85ypi  于 2023-01-24  发布在  Java
关注(0)|答案(3)|浏览(333)

如何修复以下控制台错误。
1.不支持加载不带回调的GoogleMapJavaScript API
1.无效值错误:不是HTMLInputElement的示例
由于上述错误,我的工作没有显示在谷歌搜索结果。
我不是一个开发人员,我需要建议来解决这个问题。所以,我会在我的wordpress网站纳入必要的变化。

kh212irz

kh212irz1#

靶区; DR

使用Function.prototype作为noop回调函数,可以快速删 debugging 误消息。

https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=Function.prototype

完整说明

根据Google Maps API documentationcallback参数已经被要求了很长时间,然而实际上,Google直到最近(在过去的几天内)才开始强制执行这一要求。
虽然它似乎没有打破任何东西,它现在在控制台中显示一个丑陋的错误消息...

  • 不支持加载没有回调的GoogleMapJavaScript API。*

我如何修复它?

简单来说就是指定一个callback值,设置外部API库加载完成后要触发的JavaScript函数的名称。

https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=FUNCTION_NAME

注意,**你必须指定一个真正的函数名!**否则你会触发一个"不是函数"的错误消息,并且只是用一个错误消息替换另一个错误消息。

但我没有/不需要回调函数!

如果您实际上没有回调函数在库加载后立即运行,则可以使用Function.prototype作为noop的替代。

https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=Function.prototype

Function.prototype方法是JavaScript的原生方法,完全不执行任何操作......这正是您在这种情况下所需要的!
有关Function.prototype的详细信息,请参见this unrelated SO thread...

lmyy7pcs

lmyy7pcs2#

如果在未指定回调函数的情况下加载Google Maps JavaScript API,则会出现“不支持在未指定回调函数的情况下加载Google Maps JavaScript API”错误。要修复此错误,您需要向API的URL添加回调函数,并确保正确调用该函数。
以下是您可以执行的修复错误的步骤:
找到要加载Google Maps JavaScript API的script标记,它应该类似于:
向URL添加回调函数,如下所示:
确保在JavaScript代码中定义了一个名为“initMap”的函数,该函数将在加载Google Maps JavaScript API后调用。
检查是否所有其他参数,如API密钥,库等都在URL中正确传递。
最后,重新加载页面并检查错误是否已解决。
同样需要注意的是,API密钥丢失或不正确,或者未在Google Cloud Console中启用Google Maps JavaScript API也可能导致错误。

blpfk2vs

blpfk2vs3#

我刚刚找到了这段yt视频,可能会对你有所帮助:
https://www.youtube.com/watch?v=1asukrHEqMM&ab_channel=KnowledgeBase
这对我没有多大帮助,因为我的问题略有不同,但给了我一个想法,该怎么走。希望它能帮助你。祝你好运
:::::::::E D I T::::::::
基本上,要消除此错误,您必须在运行进行API调用的脚本之前声明函数(又名initMap)。
initMap函数是创建谷歌Map并赋予其特性的函数。
initMap函数如下所示:

function initMap(): void {
  map = new google.maps.Map(document.getElementById("map") as HTMLElement, {
    center: { lat: -34.397, lng: 150.644 },
    zoom: 8,
  });
}

API调用是放置API-KEY的脚本行。

<script defer type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=API-KEY&libraries=places&callback=initMap"></script>

我找到了两个办法,第一个办法是:我有一个模块,您只需在API之前使用src脚本调用它。
示例:

<html>
    <head>
        <script defer src="js/scripts.js" type="module"></script>
        <script src="js/module/google.js"></script>
        <script defer type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=API-KEY&libraries=places&callback=initMap"></script>
    </head>
    <body></body>
</html>

谷歌网址. js是用来保护我的initMap功能的()
第二种方式是:在进行API调用之前将所有代码写入脚本标记中。
示例:

<html>
    <head>
        <script defer src="js/scripts.js" type="module"></script>
        <script>
            function initMap(): void {
            map = new google.maps.Map(document.getElementById("map") as HTMLElement, {
            center: { lat: -34.397, lng: 150.644 },
            zoom: 8,
            });
            }
        </script>
        <script defer type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=API-KEY&libraries=places&callback=initMap"></script>
    </head>
    <body></body>
</html>

注意我使用了defer,所以代码在页面底部加载,这只是我的风格,因为我喜欢在head元素中声明所有内容。

相关问题