Google Maps 脚本破坏了 Safari TypeError:表达式“document.body”[null] 的结果不是对象

Posted

技术标签:

【中文标题】Google Maps 脚本破坏了 Safari TypeError:表达式“document.body”[null] 的结果不是对象【英文标题】:Google Maps script breaks Safari TypeError: Result of expression 'document.body' [null] is not an object 【发布时间】:2011-10-08 15:47:32 【问题描述】:

我在我的网页中显示谷歌地图,它在除 Safari 之外的所有浏览器中都能正常工作。

Safri 将页面变白,JS 错误提示:

TypeError: Result of expression 'document.body' [null] is not an object.  maps.google.com/maps/api/js?sensor=true&region=nz&async=2&callback=initializeConfigMap:11
TypeError: Result of expression 'a' [null] is not an object.  maps.gstatic.com/intl/en_us/mapfiles/api-3/5/11/main.js:30

这似乎来自的代码是我使用此行从谷歌链接到的脚本:

$.getScript("http://maps.google.com/maps/api/js?sensor=true&region=nz&async=2&callback=initializeConfigMap", function () );

脚本如下所示:

window.google = window.google || ;
google.maps = google.maps || ;
(function() 

    function getScript(src) 
        var s = document.createElement('script');
        s.src = src;
        document.body.appendChild(s);
    

    var modules = google.maps.modules = ;
    google.maps.__gjsload__ = function(name, text) 
        modules[name] = text;
    ;

    google.maps.Load = function(apiLoad) 
        delete google.maps.Load;
        apiLoad([null,[[["http://mt0.googleapis.com/vt?lyrs=m@158\u0026src=api\u0026hl=en-US\u0026","http://mt1.googleapis.com/vt?lyrs=m@158\u0026src=api\u0026hl=en-US\u0026"],null,null,null,null,"m@158"],[["http://khm0.googleapis.com/kh?v=88\u0026hl=en-US\u0026","http://khm1.googleapis.com/kh?v=88\u0026hl=en-US\u0026"],null,null,null,1,"88"],[["http://mt0.googleapis.com/vt?lyrs=h@158\u0026src=api\u0026hl=en-US\u0026","http://mt1.googleapis.com/vt?lyrs=h@158\u0026src=api\u0026hl=en-US\u0026"],null,null,"imgtp=png32\u0026",null,"h@158"],[["http://mt0.googleapis.com/vt?lyrs=t@127,r@158\u0026src=api\u0026hl=en-US\u0026","http://mt1.googleapis.com/vt?lyrs=t@127,r@158\u0026src=api\u0026hl=en-US\u0026"],null,null,null,null,"t@127,r@158"],null,[[null,0,7,7,[[[330000000,1246050000],[386200000,1293600000]],[[366500000,1297000000],[386200000,1320034790]]],["http://mt0.gmaptiles.co.kr/mt?v=kr1.14\u0026hl=en-US\u0026","http://mt1.gmaptiles.co.kr/mt?v=kr1.14\u0026hl=en-US\u0026"]],[null,0,8,9,[[[330000000,1246050000],[386200000,1279600000]],[[345000000,1279600000],[386200000,1286700000]],[[348900000,1286700000],[386200000,1293600000]],[[354690000,1293600000],[386200000,1320034790]]],["http://mt0.gmaptiles.co.kr/mt?v=kr1.14\u0026hl=en-US\u0026","http://mt1.gmaptiles.co.kr/mt?v=kr1.14\u0026hl=en-US\u0026"]],[null,0,10,19,[[[329890840,1246055600],[386930130,1284960940]],[[344646740,1284960940],[386930130,1288476560]],[[350277470,1288476560],[386930130,1310531620]],[[370277730,1310531620],[386930130,1320034790]]],["http://mt0.gmaptiles.co.kr/mt?v=kr1.14\u0026hl=en-US\u0026","http://mt1.gmaptiles.co.kr/mt?v=kr1.14\u0026hl=en-US\u0026"]],[null,3,7,7,[[[330000000,1246050000],[386200000,1293600000]],[[366500000,1297000000],[386200000,1320034790]]],["http://mt0.gmaptiles.co.kr/mt?v=kr1p.12\u0026hl=en-US\u0026","http://mt1.gmaptiles.co.kr/mt?v=kr1p.12\u0026hl=en-US\u0026"]],[null,3,8,9,[[[330000000,1246050000],[386200000,1279600000]],[[345000000,1279600000],[386200000,1286700000]],[[348900000,1286700000],[386200000,1293600000]],[[354690000,1293600000],[386200000,1320034790]]],["http://mt0.gmaptiles.co.kr/mt?v=kr1p.12\u0026hl=en-US\u0026","http://mt1.gmaptiles.co.kr/mt?v=kr1p.12\u0026hl=en-US\u0026"]],[null,3,10,null,[[[329890840,1246055600],[386930130,1284960940]],[[344646740,1284960940],[386930130,1288476560]],[[350277470,1288476560],[386930130,1310531620]],[[370277730,1310531620],[386930130,1320034790]]],["http://mt0.gmaptiles.co.kr/mt?v=kr1p.12\u0026hl=en-US\u0026","http://mt1.gmaptiles.co.kr/mt?v=kr1p.12\u0026hl=en-US\u0026"]]],[["http://cbk0.googleapis.com/cbk?","http://cbk1.googleapis.com/cbk?"]],[["http://khmdb0.googleapis.com/kh?v=40\u0026hl=en-US\u0026","http://khmdb1.googleapis.com/kh?v=40\u0026hl=en-US\u0026"],null,null,null,null,"40"],[["http://mt0.googleapis.com/mapslt?hl=en-US\u0026","http://mt1.googleapis.com/mapslt?hl=en-US\u0026"]],[["http://mt0.googleapis.com/mapslt/ft?hl=en-US\u0026","http://mt1.googleapis.com/mapslt/ft?hl=en-US\u0026"]],[["http://mt0.googleapis.com/vt?hl=en-US\u0026","http://mt1.googleapis.com/vt?hl=en-US\u0026"]]],["en-US","NZ",null,0,null,"http://maps.google.com","http://maps.gstatic.com/intl/en_us/mapfiles/","http://csi.gstatic.com","https://maps.googleapis.com","http://maps.googleapis.com"],["http://maps.gstatic.com/intl/en_us/mapfiles/api-3/5/11","3.5.11"],[3021543403],1.0,null,null,null,null,1,"initializeConfigMap",null,null,0,"http://khm.googleapis.com/mz?v=88\u0026"], loadScriptTime);
    ;
    var loadScriptTime = (new Date).getTime();
    getScript("http://maps.gstatic.com/intl/en_us/mapfiles/api-3/5/11/main.js");
)();    

我相信这可能是导致问题的线路:

document.body.appendChild(s);

有什么想法吗?

【问题讨论】:

您找到解决方案了吗?我也遇到了同样的问题 不,我从未找到解决方案。我确实发现很多人在苹果和谷歌留言板上抱怨同样的问题,但没有得到任何答案。 在我的代码中,如果我没有指定 callback 参数,那么我不会收到错误消息。我可以使用callback 参数加载GMaps API 的唯一方法是在body 中加载脚本。我将稍微编辑您的问题,以便稍微弹出列表。 【参考方案1】:

此更改解决了我在 safari 和 ie7 上的一些加载问题:

尝试在脚本 url 中添加版本:&v=3.7,这是冻结版本。避免使用 3.exp 版本,这会导致一些加载问题。

【讨论】:

【参考方案2】:

我找到了解决这个问题的方法。尝试异步加载谷歌地图 API。为我工作

Asynchronously Loading the API

【讨论】:

欢迎来到 SO。不要将链接作为答案放入帖子中。将链接中的重要部分放入足以回答问题并提供更多详细信息的链接。此外,链接并不总是有效。 该链接是关于如何使用异步地图 API 的官方 google 文档。无论如何一定要记住这一点...谢谢 :)【参考方案3】:

我在使用 OS X 10.10 和 Safari 时遇到了同样的问题。通过将 async 和 defer 添加到 script 标签来解决它。

<script async defer src="https://maps.googleapis.com/maps/api/js?key=...."/>

文档是这样说的:

同步加载 API

在加载 Maps API 的脚本标签中,可以省略 async 属性和回调参数。这将导致 加载 API 以阻止直到下载 API。

这可能会减慢您的页面加载速度。但这意味着你可以写 后续脚本标签假设 API 已经加载。

除此之外,您当然应该确保 div 具有指定的高度。如果未指定,则 div 的默认高度为 0,这将隐藏地图,即使它加载。

祝你好运。

【讨论】:

以上是关于Google Maps 脚本破坏了 Safari TypeError:表达式“document.body”[null] 的结果不是对象的主要内容,如果未能解决你的问题,请参考以下文章

Google Maps API 在 Safari 中杀死 CSS 动画

MacOS Safari 11“防止跨站点跟踪”破坏了网站的谷歌登录

html [Google Maps]可自定义的Google Maps脚本,用于嵌入网站#js

React-google-maps 用户位置

在 Google Apps 脚本中使用完整的 Google Maps V3 API 及其所有功能

Google Maps V3 自定义标记未在 IE 中显示