Empêcher la mise en cache du navigateur de jQuery AJAX résultat de l'appel

ce qui suit empêchera toutes les futures requêtes AJAX D'être mises en cache, quelle que soit la méthode jQuery que vous utilisez ($.obtenir.$ ,ajax, etc.)

$.ajaxSetup({ cache: false });

de JQuery $.get () cache les résultats. Au lieu de

$.get("myurl", myCallback)

vous devez utiliser $.ajax, qui vous permettra de désactiver la mise en cache:

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

une autre façon est de ne pas fournir d'en-têtes de cache de serverside dans le code qui génère la réponse à l'appel ajax:

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

toutes les réponses ici laissent une empreinte sur L'URL demandée qui apparaîtra dans les journaux d'accès du serveur.

j'avais besoin d'une solution basée sur l'en-tête sans effet secondaire et j'ai trouvé qu'elle peut être obtenue en configurant les en-têtes mentionnés dans Comment contrôler la mise en cache de page web, sur tous les navigateurs? .

le résultat, travaillant pour le Chrome au moins, serait

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

personnellement, je pense que la méthode de la chaîne de requête est plus fiable que d'essayer de mettre des en - têtes sur le serveur - il n'y a aucune garantie qu'un proxy ou un navigateur ne se contentera pas de le mettre en cache de toute façon (certains navigateurs sont pires que d'autres-ne nommant aucun nom).

j'utilise habituellement Math.random() mais je ne vois rien de mal à utiliser la date (vous ne devriez pas faire des requêtes AJAX assez rapidement pour obtenir la même valeur deux fois).

suivant la documentation: http://api.jquery.com/jquery.ajax /

vous pouvez utiliser la propriété cache avec:

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

la vraie question est pourquoi vous avez besoin de cela pour ne pas être mis en cache. Si elle ne doit pas être mise en cache parce qu'elle change tout le temps, le serveur doit spécifier de ne pas mettre en cache la ressource. Si elle change juste parfois (parce qu'une des ressources dont elle dépend peut changer), et si le code client a un moyen de le savoir, il peut ajouter un paramètre fictif à l'url qui est calculée à partir d'un certain hachage ou de la date de dernière modification de ces ressources (c'est ce que nous faisons dans les ressources de script Ajax de Microsoft donc ils peuvent être mis en cache pour toujours mais de nouvelles versions peuvent encore être servies telles qu'elles apparaissent). Si le client ne peut pas être au courant des changements, la bonne façon devrait être que le serveur traite les requêtes HEAD correctement et indique au client s'il doit utiliser la version mise en cache ou non. Il me semble que l'ajout d'un paramètre aléatoire ou le fait de dire au client de ne jamais mettre en cache est une erreur parce que la possibilité de mise en cache est une propriété de la ressource du serveur, et donc devrait être décidé côté serveur. Une autre question à se poser est si ce la ressource doit-elle vraiment être servie par L'intermédiaire de GET ou doit-elle passer par POST? C'est une question de sémantique, mais cela a aussi des implications de sécurité (il y a des attaques qui ne fonctionnent que si le serveur autorise GET). POST ne sera pas mis en cache.

peut-être que tu devrais regarder $.ajax() à la place (si vous utilisez jQuery, qui elle ressemble). Regardez: http://docs.jquery.com/Ajax/jQuery.ajax#options et l'option"cache".

une autre approche serait de regarder comment vous mettez les choses en cache du côté du serveur.

bien sûr, les techniques de" casse de cache " feront le travail, mais ce ne sera pas le cas en premier lieu si le serveur indique au client que la réponse ne doit pas être mise en cache. Dans certains cas, il est avantageux de mettre en cache les réponses, parfois non. Laissez le serveur décider de la durée de vie correcte des données. Vous pouvez le changer plus tard. Beaucoup plus facile à faire à partir du serveur qu'à partir de nombreux endroits différents de votre code D'interface utilisateur.

bien sûr, cela n'aide pas si vous n'avons aucun contrôle sur le serveur.

Qu'en est-il de l'utilisation d'une requête POST au lieu d'un GET...? (Vous devriez de toute façon...)

un petit ajout aux excellentes réponses données: si vous exécutez avec une solution de sauvegarde non-ajax pour les utilisateurs sans javascript, vous devrez obtenir ces en-têtes côté serveur correct de toute façon. Ce n'est pas impossible, bien que je comprenne ceux qui y renoncent ;)

je suis sûr qu'il y a une autre question pour vous donner l'ensemble complet des en-têtes qui sont appropriés. Je ne suis pas entièrement convaincu miceus réponse couvre toutes les bases 100%.

pour ceux d'entre vous qui utilisent l'option cache de $.ajaxSetup() sur un Safari mobile, il semble que vous ayez à utiliser un timestamp pour les messages, puisque le Safari mobile cache cela aussi. Selon la documentation sur $.ajax() (à laquelle vous êtes dirigé de $.ajaxSetup() ):

mettre cache à false ne fonctionnera correctement qu'avec les requêtes HEAD et GET. Il fonctionne en ajoutant "_={timestamp}" aux paramètres GET. Le paramètre n'est pas nécessaire pour d'autres types de requêtes, sauf dans IE8 lorsqu'un message est envoyé à une URL qui a déjà été demandée par un GET.

donc le réglage de cette option Ne vous aidera pas dans le cas que j'ai mentionné ci-dessus.

fondamentalement, il suffit d'ajouter cache:false; dans l'ajax où vous pensez que le contenu va changer que le progrès continue. Et l'endroit où le contenu ne changeront pas il u peut omettre cette. De cette façon u obtiendra la nouvelle réponse à chaque fois

la mise en cache Ajax D'Internet Explorer: Qu'allez-vous faire à ce sujet? suggère trois approches:

1. Ajouter un jeton de buste de cache à la chaîne de requête, comme ?date=[timestamp]. Dans jQuery et YUI vous pouvez leur dire de le faire automatiquement.
2. Utiliser POST au lieu d'un GET
3. envoyer un en-tête de réponse HTTP qui interdit spécifiquement aux navigateurs de le mettre en cache

maintenant, il est facile de le faire en activant / désactivant l'option cache dans votre requête ajax, tout comme ceci

$(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);
    }
});

si vous utilisez IE 9, alors vous devez utiliser ce qui suit devant votre définition de classe de contrôleur:

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

contrôleur D'essai de classe publique: contrôleur

cela empêchera le navigateur de cacher.

Détails sur ce lien: http://dougwilsonsa.wordpress.com/2011/04/29/disabling-ie9-ajax-response-caching-asp-net-mvc-3-jquery/

en Fait, cela a résolu mon problème.

comme L'a dit @Athasach, selon les documents de jQuery, $.ajaxSetup({cache:false}) ne fonctionnera pas pour autre chose que les requêtes GET et HEAD.

il est préférable de renvoyer un en-tête Cache-Control: no-cache de votre serveur de toute façon. Il permet une séparation plus nette des préoccupations.

bien sûr, cela ne fonctionnerait pas pour les urls de service que vous n'appartenez pas à votre projet. Dans ce cas, vous pourriez envisager de proxy le service tiers à partir du code du serveur plutôt que Je l'appelle du code client.

si vous utilisez .net ASP MVC, désactivez la mise en cache de l'action controller en ajoutant l'attribut suivant sur la fonction end point.: [OutputCacheAttribute (VaryByParam ="*", Duration = 0, NoStore = true)]

ajouter des Mathématiques.random() à l'url de la requête