Предотвращение кеширования браузером результата вызова AJAX

Похоже, что если я загружаю динамический контент $.get(), результат кэшируется в браузере.

Добавление некоторой случайной строки в QueryString, кажется, решает эту проблему (я использую new Date().toString()), но это похоже на хак.

Есть ли другой способ добиться этого? Или, если уникальная строка - единственный способ добиться этого, есть какие-то предложения, кроме new Date()?

Я использую new Date().getTime(), что позволит избежать коллизий, если у вас есть несколько запросов, происходящих в течение одной миллисекунды:

$.get('/getdata?_=' + new Date().getTime(), function(data) {
    console.log(data); 
});

Изменить: этому ответу несколько лет. Это все еще работает (следовательно я не удалил это), но есть лучшие / более чистые способы достигнуть этого теперь . Я предпочитаю этот метод, но этот ответ также полезен, если вы хотите отключить кэширование для каждого запроса во время жизни страницы.

Следующее действие предотвратит кэширование всех будущих запросов AJAX независимо от того, какой метод jQuery вы используете ($ .get, $ .ajax и т. Д.)

$.ajaxSetup({ cache: false });

$ .Get () JQuery будет кэшировать результаты. Вместо того

$.get("myurl", myCallback)

вы должны использовать $ .ajax, который позволит вам отключить кеширование:

$.ajax({url: "myurl", success: myCallback, cache: false});

Все ответы здесь оставляют след на запрошенном URL, который будет отображаться в журналах доступа сервера.

Мне нужно было решение на основе заголовков без побочных эффектов, и я обнаружил, что этого можно добиться, установив заголовки, упомянутые в разделе Как контролировать кэширование веб-страниц во всех браузерах? ,

Результат, по крайней мере, для Chrome:

$.ajax({
   url: url, 
   headers: {
     'Cache-Control': 'no-cache, no-store, must-revalidate', 
     'Pragma': 'no-cache', 
     'Expires': '0'
   }
});

Другой способ - не предоставлять заголовки кэша со стороны сервера в коде, который генерирует ответ на вызов ajax:

response.setHeader( "Pragma", "no-cache" );
response.setHeader( "Cache-Control", "no-cache" );
response.setDateHeader( "Expires", 0 );

Лично я чувствую, что метод строки запроса более надежен, чем попытка установить заголовки на сервере - нет гарантии, что прокси или браузер все равно не просто кеширует его (некоторые браузеры хуже других - не называя имен).

Я обычно использую, Math.random()но я не вижу ничего плохого в использовании даты (вам не следует выполнять запросы AJAX достаточно быстро, чтобы получить одно и то же значение дважды).

Следующая документация: http://api.jquery.com/jquery.ajax/

Вы можете использовать cacheсвойство с:

$.ajax({
    method: "GET",
    url: "/Home/AddProduct?",
    data: { param1: value1, param2: value2},
    cache: false,
    success: function (result) {
        // TODO
    }
});

Конечно, методы «взлома кеша» выполнят работу, но в первую очередь этого не произойдет, если сервер сообщит клиенту, что ответ не должен кэшироваться. В некоторых случаях полезно кэшировать ответы, иногда нет. Пусть сервер решит правильное время жизни данных. Вы можете изменить это позже. Гораздо проще сделать это с сервера, чем из разных мест в вашем коде пользовательского интерфейса.

Конечно, это не поможет, если у вас нет контроля над сервером.

Как насчет использования запроса POST вместо GET ...? (Что вы все равно должны ...)

На самом деле вопрос в том, зачем вам это не кэшировать. Если он не должен кэшироваться, потому что он все время меняется, сервер должен указать, что не следует кэшировать ресурс. Если он просто иногда изменяется (потому что может измениться один из ресурсов, от которого он зависит), и если клиентский код имеет возможность узнать об этом, он может добавить фиктивный параметр к URL-адресу, который вычисляется по некоторому хэшу или дате последнего изменения из этих ресурсов (это то, что мы делаем в ресурсах сценариев Microsoft Ajax, чтобы они могли кэшироваться вечно, но новые версии могут по-прежнему обслуживаться по мере их появления). Если клиент не может знать об изменениях, сервер должен правильно обрабатывать запросы HEAD и сообщать клиенту, использовать кэшированную версию или нет. Мне кажется, что добавление случайного параметра или указание от клиента никогда не кэшировать - это неправильно, потому что кэшируемость является свойством ресурса сервера, и поэтому следует принимать решение на стороне сервера. Другой вопрос, который нужно задать себе: должен ли этот ресурс действительно обслуживаться через GET или он должен проходить через POST? Это вопрос семантики, но он также имеет последствия для безопасности (существуют атаки, которые работают, только если сервер допускает GET). POST не будет кэшироваться.

Возможно, вам следует взглянуть на $ .ajax () (если вы используете jQuery, как это выглядит). Взгляните на: http://docs.jquery.com/Ajax/jQuery.ajax#options и опцию «кеш».

Другой подход - посмотреть, как вы кешируете вещи на стороне сервера.

Небольшое дополнение к полученным отличным ответам: Если вы работаете с решением для резервного копирования не-ajax для пользователей без javascript, вам все равно придется корректировать заголовки на стороне сервера. Это не невозможно, хотя я понимаю тех, кто бросает это;)

Я уверен, что есть еще один вопрос о SO, который даст вам полный набор заголовков, которые подходят. Я не совсем убежден, что мышиный ответ охватывает все основания на 100%

Для тех из вас, кто использует cacheопцию $.ajaxSetup()на мобильном Safari, может показаться, что вам нужно использовать временную метку для POST, поскольку мобильный Safari также кеширует ее. Согласно документации $.ajax()(на которую вы направлены от $.ajaxSetup()):

Установка кеша в ложь будет корректно работать только с HEAD и GET запросами. Это работает путем добавления "_ = {timestamp}" к параметрам GET. Параметр не нужен для других типов запросов, кроме IE8, когда выполняется POST для URL, который уже был запрошен GET.

Так что установка этой опции сама по себе не поможет вам в случае, о котором я упоминал выше.

По сути, просто добавьте cache:false;в ajax, где вы думаете, что контент будет меняться по мере продвижения. И место, где контент не изменится, вы можете пропустить. Таким образом, вы получите новый ответ каждый раз

Ajax-кэширование в Internet Explorer: что вы собираетесь с этим делать? предлагает три подхода:

1. Добавьте токен очистки кэша в строку запроса, например? Date = [timestamp]. В jQuery и YUI вы можете сказать им делать это автоматически.
2. Используйте POST вместо GET
3. Отправьте заголовок ответа HTTP, который запрещает браузерам кэшировать его.

Теперь это легко сделать, включив / отключив опцию кэширования в вашем запросе ajax, вот так

$(function () {
    var url = 'your url goes here';
    $('#ajaxButton').click(function (e) {
        $.ajax({
            url: url,
            data: {
                test: 'value'
            },
                cache: true, //cache enabled, false to reverse
                complete: doSomething
            });
        });
    });
    //ToDo after ajax call finishes
    function doSomething(data) {
        console.log(data);
    }
});

Если вы используете IE 9, то вам нужно использовать следующее перед определением класса вашего контроллера:

[OutputCache (NoStore = true, Duration = 0, VaryByParam = "*")]

Открытый класс TestController: контроллер

Это предотвратит кеширование браузера.

Подробности по этой ссылке: http://dougwilsonsa.wordpress.com/2011/04/29/disabling-ie9-ajax-response-caching-asp-net-mvc-3-jquery/

На самом деле это решило мою проблему.

Как сказал @Athasach, согласно документам jQuery, $.ajaxSetup({cache:false})он не будет работать для запросов, отличных от GET и HEAD.

Вам все Cache-Control: no-cacheравно лучше отправлять заголовок с вашего сервера. Это обеспечивает более четкое разделение проблем.

Конечно, это не будет работать для сервисных URL, которые не принадлежат вашему проекту. В этом случае вы можете рассмотреть возможность передачи сторонней службы из кода сервера, а не вызывать ее из кода клиента.

Если вы используете .net ASP MVC, отключите кэширование в действии контроллера, добавив следующий атрибут в функцию конечной точки:

[OutputCacheAttribute(VaryByParam = "*", Duration = 0, NoStore = true)]

добавить заголовок

headers: {
                'Cache-Control':'no-cache'
            }

добавить Math.random() к запросу URL