Загружать API карт Google, когда Интернет доступен через Ext.data.connection Sencha Touch и Phonegap

Я использую Sencha Touch и Phonegap для создания небольшого приложения.
В этом приложении мне нужен API карт Google, так как я хочу отображать карту.

Существует проблема, если устройство не подключено к Интернету, поэтому API карт Google не может быть загружен в html. Поэтому я проверяю подключение к Интернету.
Если подключение к Интернету доступно, я пытаюсь загрузить API карт Google с помощью Ext.data.connection:

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 http://maps.google.com/maps/api/js?sensor=true&_dc=1302077479281. Origin null is not allowed by Access-Control-Allow-Origin.

Неважно, пытаюсь ли я вызвать HTML через file:/// или через веб-сервер (http://localhost/app)

Как я могу получить API карт Google и «обойти» или избежать этого поведения управления доступом?


cordova javascript xmlhttprequest google-chrome sencha-touch
person hering    schedule 06.04.2011    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Херинг, простите, это будет не простой ответ.

Я думаю, вы хотите использовать условный загрузчик скриптов. Это API, которые добавят скрипт в документ, только если будет выполнено условие (у вас есть сетевое подключение).

Хороший вариант — http://yepnopejs.com/.

По этой ветке можно загружать гугл карты, но надо делать как написано в ветке. Карты Google с YepNope

В частности, включите yepnope.js и удалите все ссылки на карты Google.

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

Когда пришло время отобразить карту (что необходимо сделать после полной загрузки Google Maps), убедитесь, что вы добавили карту Ext.Map, а затем вызовите:

this.doLayout();

Я думаю, что это отлично сработает для вас, это работает для меня...

person ballmw    schedule 07.04.2011
comment
Спасибо за ваш ответ, это может сработать. Я опубликовал решение самостоятельно без каких-либо дополнительных библиотек... - person hering; 07.04.2011
comment
С yepnope я могу делать другие вещи с успехом и неудачей, это целый API, возможно, излишний для того, что вам нужно. - person ballmw; 07.04.2011

arrow_upward
3
arrow_downward

Я нашел некоторые инструкции из Google, так что следующее будет работать:

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);
person hering    schedule 07.04.2011