美文网首页
引入百度地图js时产生的问题

引入百度地图js时产生的问题

作者: Ernest_Chou | 来源:发表于2017-01-11 16:10 被阅读0次

    页面引入百度地图API:

    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3&ak=XhxWo4lQh2KfH3phyElA17ljQC1wwqjT"></script>
    
    

    产生如下问题:

    api:1 A Parser-blocking, cross-origin script, http://api.map.baidu.com/getscript?v=1.3&ak=XhxWo4lQh2KfH3phyElA17ljQC1wwqjT&services=&t=20150527115231, is invoked via document.write. This may be blocked by the browser if the device has poor network connectivity.
    

    即为报错:A Parser-blocking, cross-origin script, is invoked via document.write.
    在页面渲染完成后就不能使用 document.write 方法。
    根据博客的说明尝试如下方法:

    <script>
                //异步加载百度地图,解决谷歌等浏览器在页面渲染完成后就不能使用 document.write 方法的问题:
                var cnzz_s_tag = document.createElement('script');
                cnzz_s_tag.type = 'text/javascript';
                cnzz_s_tag.async = true;
                cnzz_s_tag.charset = 'utf-8';
                cnzz_s_tag.src = 'http://api.map.baidu.com/api?v=1.3&ak=XhxWo4lQh2KfH3phyElA17ljQC1wwqjT&async=1';
                var root_s = document.getElementsByTagName('script')[0];
                root_s.parentNode.insertBefore(cnzz_s_tag, root_s);
            </script>
    

    出现问题:

    api:1 Failed to execute 'write' on 'Document': It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened.
    

    后来发现页面引入的百度的js内容为:

    (function(){ 
            window.BMap_loadScriptTime = (new Date).getTime(); 
            document.write('<script type="text/javascript" src="http://api.map.baidu.com/getscript?v=1.3&ak=XhxWo4lQh2KfH3phyElA17ljQC1wwqjT&services=&t=20150527115231"></script>');
            document.write('<link rel="stylesheet" type="text/css" href="http://api.map.baidu.com/res/13/bmap.css" />');
    })();
    

    里面包含了 document.write方法,异步加载的js是不允许使用document.write方法的

    直接引用这两个地址的jshttp://api.map.baidu.com/getscript?type=quick&file=api&ak=o9B4Ol99j9NcBXSu5nFTR7uI&t=20140109092002http://api.map.baidu.com/getscript?type=quick&file=feature&ak=o9B4Ol99j9NcBXSu5nFTR7uI&t=20140109092002就可以了

    相关文章

      网友评论

          本文标题:引入百度地图js时产生的问题

          本文链接:https://www.haomeiwen.com/subject/jadrbttx.html