Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Применение библиотек > Ajax и кэш. Есть проблема


Автор: Panoramix 26.3.2007, 13:40
Здравствуйте!
Есть проблема (судя по результатам гугла, не только у меня). Существует достаточно сложная форма для отправки новостей на сайт. Она принимает либо html, либо bbcode (в зависимости от переключателя (id: use_html_box). Кроме кнопки "отправить" внизу существуют ещё две кнопки: "предпросмотр" (id: preview_button) и "получить html" (id: html_button). Обе сделаны на AJA,

M
12345c		Поясните, что такое AJA, и где её искать. Иначе выглядит как ошибка.

 причём абсолютно одинаковым способом. Первая посылает запрос на php-скрипт, получает спарсированный из bbcode html-код и отображает его внутри div'а (id: news_preview), появляющегося вместо формы (id: news_edit), а вторая - тот же код, только с заменёнными на символы угловыми скобками и пр. (php-функция htmlspecialchars()), после чего отображает его в нередактируемом textarea (id: html_response), появляющемся на месте textarea для редактирования статьи (id: news_body). Обе кнопки при повторном нажатии возвращают форму на место.

JS-код:
Код

function preview()
{
    button = document.getElementById('preview_button');
    if (button.innerHTML == 'Предпросмотр')
    {
        button.innerHTML = 'Подождите...';
        url = "<?=$_SERVER['SCRIPT_NAME']?>?action=preview&rand="+Math.random();
        var ai = new AjaxInteraction(url, false, function(text) {document.getElementById('news_preview').innerHTML = text; document.getElementById('news_edit').style.display = 'none'; document.getElementById('news_preview').style.display = 'block'; document.getElementById('preview_button').innerHTML = 'Редактировать';});
        var body = "body=" + document.getElementById('news_body').value + "&html=" + ((document.getElementById('use_html_box').checked) ? "1" : "0");
        ai.doPost(body);
    }
    else if (button.innerHTML == 'Редактировать')
    {
        button.innerHTML = 'Предпросмотр';
        document.getElementById('news_preview').style.display = 'none';
        document.getElementById('news_edit').style.display = 'block';
    }
}

function getHTML()
{
    button = document.getElementById('html_button');
    if (button.innerHTML == 'Получить HTML-код')
    {
        button.innerHTML = 'Подождите...';
        url = "<?=$_SERVER['SCRIPT_NAME']?>?action=get_html&rand="+Math.random();
        var ai = new AjaxInteraction(url, false, function(text) {document.getElementById('html_response').innerHTML = text; document.getElementById('html_response').select; document.getElementById('news_body').style.display = 'none'; document.getElementById('html_response').style.display = 'block'; document.getElementById('html_button').innerHTML = 'Редактировать';});
        var body = "body=" + document.getElementById('news_body').value + "&html=" + ((document.getElementById('use_html_box').checked) ? "1" : "0");
        ai.doPost(body);
    }
    else if (button.innerHTML == 'Редактировать')
    {
        button.innerHTML = 'Получить HTML-код';
        document.getElementById('html_response').style.display = 'none';
        document.getElementById('news_body').style.display = 'block';
    }
}


Как видите, обе функции построены совершенно одинаково, и, более того, при тестировании с помощью FireBug становится видно, что они возвращают совершенно правильные ответы с сервера.
ОДНАКО: Если в IE всё отлично работает, то в Opera и Firefox кнопка "предпросмотр" работает без проблем, а вот такая же кнопка "получить html" даже при правильном ответе с сервера первое нажатие после перезагрузки отображает нормально, а вот при последующих каждый раз берёт информацию из кэша, то есть не хочет обновлять её, а отображает то, что было запрошено в первый раз!

Я использовал всё, что советуют по этому поводу в интернете (случайные переменные, дописанные к URL, заголовки "no-cache" в php) - но ничего не помогло!!!

Я не понимаю, что делать - если кто-нибудь сталкивался с таким, пожалуйста, помогите!

P.S. Вот код использованной мною библиотеки Aja(x) - объект AjaxInteraction():
Код

// Параметры:
// string url - адрес запрашиваемого скрипта или файла.
// function callback - функция, которая выполнится при получении ответа с сервера формата function(...) {что-нибудь; }.
// bool xml - если true, то функция выдаёт xml, если false - обычный текст (или HTML).
function AjaxInteraction(url, xml, callback)
{
    var req = init();
    req.onreadystatechange = processRequest;

    function init()
    {
        if (window.XMLHttpRequest)
        {
            return new XMLHttpRequest();
        }
        else if (window.ActiveXObject)
        {
            return new ActiveXObject("Microsoft.XMLHTTP");
        }
    }

    function processRequest()
    {
        if (req.readyState == 4)
        {
            if (req.status == 200)
            {
                if (xml)
                {
                    if (callback) callback(req.responseXML);
                }
                else
                {
                    if (callback) callback(req.responseText);
                }
            }
        }
    }

    this.doGet = function()
    {
        req.open("GET", url, true);
        req.send(null);
    }

    this.doPost = function(body)
    {
        req.open("POST", url, true);
        req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;");
        req.send(body);
    }
}

Автор: Бонифаций 26.3.2007, 14:17
Я сталкивался с этим, и нашел комбинацию, которая вроде работает во всех browser. 

В ajax - ответе (то есть в том  что у вас обрабатывает $_SERVER['SCRIPT_NAME']?>?action=get_html&rand="+Math.random() )  устанавливаю

Код

   response.setHeader("Pragma","no-cache"); //HTTP 1.0
    response.setHeader("Cache-Control","no-cache"); //HTTP 1.1
    response.setDateHeader("Expires", 0); //prevents caching at the proxy server
    response.setHeader("Cache-Control", "private"); // HTTP 1.1
    response.setHeader("Cache-Control", "no-store"); // HTTP 1.1
    response.setHeader("Cache-Control", "max-stale=0"); // HTTP 1.1


PS. у меня это jsp, так что на php сами уж как-нибудь переведите

Автор: Panoramix 26.3.2007, 19:39
спасибо, сейчас попробую..

p.s. Moderator: AJA, в отличие от AJAX - это просто Асинхронный JavaScript, без XML..


M
12345c		Хм, тогда это просто неправильно, потому что никто так его не называет и по поиску его не найдут. Тогда, значит, правильно сделал, что в заголовке поправил, но подумал, что вдруг кто-то свою библиотеку так назвал : ).

Автор: Panoramix 26.3.2007, 19:57
 smile
Не помогает. Попробовал и опубликованную комбинацию, и сам чего-то менял, ничего. Если кому интересно, на PHP оно выглядит так:
Код

    header("Pragma: no-cache");
    header("Cache-Control: no-cache, must-revalidate");
    header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
    header("Cache-Control: private");
    header("Cache-Control: max-stale=0");


Ни-че-го-не-по-ни-ма-ю...
Firefox, smile!
Opera, smile!

Больше всего поражает то, что одна кнопка работает, а другая, такая же! - нет... smile

Автор: Panoramix 26.3.2007, 20:54
Так.  smile
Только что обнаружилась престранная вещь. Если в параметре-функции AjaxInteraction вместо всего прописать тупое alert(text) - то... оно выдаёт правильный результат!!! Кэш текстового поля? =) Я в замешательстве. Сейчас буду разбираться..

Добавлено через 11 минут и 15 секунд
Люди!!! Всем спасибо за попытки помочь, но над моими багами вы, к сожалению, не властны, т.к. не имеете к ним доступа, они у меня в мозгах. smile 
Всё дело не в кэше и не в Aja(Moderator - user posted image), а в том, что Firefox'у и Опере не нравится конструкция
Код
[textarea].innerHTML = [текст];

Они с её помощью дают обновить поле только один раз, Бог знает почему..

А вот такая фишка:
Код
[textarea].value = [текст];

..меняет всё дело.

Занавес. Тему можно удалить из-за её неоспоримой глупости.
smile

Автор: Бонифаций 26.3.2007, 21:19
А чем вызвано то что вы ручками всякие там [textarea].innerHTML устанавливаете? Почему не (скажем) проверенный в боях prototype.js ?

Автор: Panoramix 27.3.2007, 14:49
Почему не использую сторонние библы? Потому что в них много лишнего, а в своей я использую только то, что мне нужно.
А что такое prototype.js?

Автор: Бонифаций 27.3.2007, 14:52
http://www.prototypejs.org/ 

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)