我使用 Sencha Touch 和 Phonegap 构建了一个小应用程序。
在此应用中,我需要 google maps API,因为我想显示 map 。
如果设备没有互联网连接就会出现问题,因此无法在 html 中加载 google maps API。所以我检查互联网连接。
如果互联网连接可用,我会尝试使用 Ext.data.connection 加载 google maps 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'}
);
如果我在谷歌浏览器中测试应用程序,我会收到以下错误:XMLHttpRequest cannot load <a href="http://maps.google.com/maps/api/js?sensor=true&" rel="noreferrer noopener nofollow">http://maps.google.com/maps/api/js?sensor=true&</a>;_dc=1302077479281. Origin null is not allowed by Access-Control-Allow-Origin.
如果我尝试通过 file:///
调用 HTML 并不重要或通过网络服务器 ( http://localhost/app
)
我怎样才能获得谷歌地图 API 并“绕过”或避免这种访问控制行为?
最佳答案
Hering,抱歉,这不是一个简单的答案。
我认为您想使用条件脚本加载器。这些是只有在满足条件(您有网络连接)时才会将脚本添加到文档的 API。
根据该线程,可以加载谷歌地图,但您必须按照线程中的说明进行操作。 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"
});
}
}]);
渲染 map 时(必须在 Google map 完全加载后完成)确保添加 Ext.Map 卡,然后调用:
this.doLayout();
我认为这对你很管用,对我也很管用...
关于javascript - 通过 Ext.data.connection Sencha Touch 和 Phonegap 在互联网可用时加载谷歌地图 API,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5563543/