当互联网可用时，通过 Ext.data.connection Sencha Touch 和 Phonegap 加载谷歌地图 API答案

【问题标题】：Load google maps API when internet is available via Ext.data.connection Sencha Touch and Phonegap当互联网可用时，通过 Ext.data.connection Sencha Touch 和 Phonegap 加载谷歌地图 API
【发布时间】：2011-07-30 15:07:57
【问题描述】：

我使用 Sencha Touch 和 Phonegap 构建了一个小应用程序。
在这个应用程序中，我需要谷歌地图 API，因为我想显示地图。

如果设备没有互联网连接，则会出现问题，因此无法在 html 中加载 google maps API。所以我检查了互联网连接。
如果互联网连接可用，我尝试使用 Ext.data.connection 加载谷歌地图 API：

var conn = new Ext.data.Connection();
var url = 'http://maps.google.com/maps/api/js?sensor=true&'; 
conn.request({  
     url: url,
     callback: function(options, success, response){
           if(response && response.responseText){
                // do something
           }
     },
     method:'GET'}
);

如果我在 google chrome 中测试应用程序，我会收到以下错误：XMLHttpRequest cannot load @987654321@;_dc=1302077479281. Origin null is not allowed by Access-Control-Allow-Origin.

无论我尝试通过file:/// 还是通过网络服务器 (http://localhost/app) 调用 HTML 都没有关系

如何获取 google maps API 并“绕过”或避免这种访问控制行为？

【问题讨论】：

标签： javascript google-chrome xmlhttprequest cordova sencha-touch

【解决方案1】：

Hering，抱歉，这不是一个简单的答案。

我认为您想使用条件脚本加载器。这些是仅在满足条件（您有网络连接）时才会将脚本添加到文档中的 api。

一个好的是http://yepnopejs.com/

根据这个线程，可以加载谷歌地图，但你必须按照线程中的说明进行操作。 Google Maps with YepNope

具体来说，包括 yepnope.js 并删除对谷歌地图的任何引用。

yepnope([{
        load: 'http://www.google.com/jsapi',
        callback: function(){
            google.load("maps", "3", {
                callback: function(){
                    console.log("loaded");
                },
                other_params: "sensor=false"
            });
        }
    }]);

当需要渲染地图时（必须在 Google 地图完全加载后完成），请确保添加 Ext.Map 卡，然后调用：

this.doLayout();

我认为这对你很有用，它对我有用......

【讨论】：

感谢您的回答，这可能有效。我自己发布了一个解决方案，不需要额外的库...
有了 yepnope，我可以在成功和失败的情况下做其他事情，它是一个完整的 API，对于你需要的东西来说可能有点矫枉过正。

【解决方案2】：

我从谷歌找到了一些说明，所以以下内容将起作用：

var script = document.createElement("script");
script.type = "text/javascript";
script.src = "http://maps.google.com/maps/api/js?sensor=true&callback=initializeMap";
document.body.appendChild(script);

【讨论】：