Вывод Ajax.Updater искажен только при первой загрузке iPhone - PullRequest
4 голосов
/ 02 апреля 2012

Когда пользователь впервые загружает мою страницу на iPhone (отлично работает на Android, IE, FF, Opera, Chrome, Safari), две части страницы, генерируемые вызовом Prototype / Scriptaculous Ajax.Updater:искаженный - они выглядят так, как будто двоичный файл был введен в страницу или карта символов была зашифрована.Если пользователь затем перезагружает страницу или использует вкладки страницы для навигации по запросам Ajax.Updater, все в порядке.Это происходит только в первый раз, когда страница загружается в сеансе браузера.Вот соответствующие вызовы с небольшим контекстом:

soundManager.onready(function(){
    new Ajax.Updater('PlayerSet', 'http://' + location.host +
        playerHTMLloc, {method: 'post', onComplete: startPlayer});
});

Это вызывается только один раз за посещение сайта (поэтому пользователь должен перезагрузиться, чтобы он правильно отображался).Он вызывает скрипт Python, который записывает html в stdout.

Вот другое:

show: function(elm) {
    var id = elm.identify();
    elm.addClassName(id.sub('-html', '-selected'));
    var link = 'ajax/' + id.sub('-', '.');
    $('centercontent').update('<div id="floaterForSpinner"></div><div
          id="centerSpinner"><img src="images/ajax-loader.gif"></div>');
    new Ajax.Updater('centercontent', link, {evalScripts: 'true',
        method: 'post'});
}

Это часть небольшого класса, который обрабатывает вкладки на странице.Опять же, только при первом вызове show () происходит ошибка.После этого таббер работает нормально.Программа обновления просто извлекает HTML-текстовые файлы с сервера.

Эта проблема возникает как с Prototype / Scripty 1.6.1 / 1.8.3, так и с 1.7 / 1.9.0.

Отправка и получениезаголовки одинаковы для первой и последующих загрузок, и допустимая кодировка во всех случаях составляет Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.7 для Firebug.

У меня нет самого iPhone, и я не имею ни одного из имитаторов выключенного или онлайн-iPhone.Мы пытались воспроизвести проблему, поэтому тестирование будет кошмаром.Следовательно, все, что кто-либо может сделать, чтобы помочь, было бы ... очень полезно.

ОБНОВЛЕНИЕ на основе вопросов, которые я получил в списке прототипов GG:

Весь приведенный выше код вызывается после загрузки DOM:

document.observe('dom:loaded', function() {
        Ajax.Responders.register({onCreate: removeListeners});
        Ajax.Responders.register({onComplete: postAJAX});
        new Lightbox();
        initMailList();
        AT = new AjaxTabber('tablist');
        initInternalLinkListener();
        initIE6msgClose();
        $('PlayerSet').update('<div style="text-align:center">
            <img src="images/ajax-loader.gif"></div>');
        soundManager.onready(function(){
            new Ajax.Updater('PlayerSet', 'http://' + location.host +
                 playerHTMLloc, {method: 'post', onComplete: startPlayer});
        });
}); 

AjaxTabber - это класс вкладок, содержащий функцию show (), о которой я упоминал ранее.Приведенная выше функция document.observe находится в последнем js-файле в заголовке.

ОБНОВЛЕНИЕ № 2:

Замена

document.observe('dom:loaded', function() {

на

Event.observe(window, 'load', function() {

в 3-м блоке кода фиксирует искаженные нагрузки.Однако, исправление поднимает новые вопросы / проблемы:

  1. Почему для загрузки Ajax.Updater должна быть загружена вся страница для правильной работы?Загрузка DOM должна быть всем, что необходимо.Нет причин, по которым изображения должны загружаться для загрузки AJAX.
  2. Моя общая производительность страницы теперь существенно снижена, чтобы решить проблему только с iPhone.Я бы очень хотел вернуться к загрузке после завершения загрузки DOM.

1 Ответ

0 голосов
/ 21 января 2014

Вызов update () и затем Ajax.Updater для одного и того же элемента один за другим может привести к проблемам с синхронизацией, которые могут быть трудно диагностировать. Я рекомендую сделать это вместо этого (чтобы добавить индикатор загрузки в ваш Ajax-загрузочный элемент):

new Ajax.Updater('elementID', '/path/to/server', {
  parameters: {}, 
  method: 'get',
  onCreate: function(){
    $('elementID').update('placeholder html here');
  },
  onSuccess: function(){
    // any other cleanup here
  }
});

Хук обратного вызова onCreate гарантирует выполнение и завершение до отправки запроса и обновления элемента A.U.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...