Jquery Cache avec IE et un fichier XML

**polemoss** · 20/04/2009, 00h28

Bonjour,
J'ai créer un tchat en Ajax avec Jquery qui marche parfaitement bien tant que le navigateur (IE) ne met pas en cache :

Vérifier s'il existe une version plus récente des pages enregistrées : A chaque visite de cette page Web

Si je laisse l'option à :

Automatique

Le fichier XML est mis en cache et n'est plus raffraichi.

J'ai pourtant tout essayé :

En php j'ai mis sur toutes mes pages :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); // Date du passé

Et dans mon code AJax qui lit le fichier xml

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
var date = new Date();
var all_sec = date.getTime();
url: "chat.xml?time="+all_sec+""

et aussi bien sur

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
beforeSend: function(xml) {
   xml.setRequestHeader('Cache-Control', 'no-cache');
   xml.setRequestHeader('Pragma', 'no-cache');
}

ou on ne sais jamais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
beforeSend: function(xhr) {
   xhr.setRequestHeader('Cache-Control', 'no-cache');
   xhr.setRequestHeader('Pragma', 'no-cache');
}

Là je ne sais plus quoi faire

mais il doit bien exister une solution non ? je ne peux pas forcer les internautes à passer à firefox ou de changer les options d'IE

Voici tout mon code JS :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
 
/**
 * @author Antoine DAVID
 */
(function($){
    $.fn.ajaxChat = function(params){
 
        /*var params = $.extend({
            refresh:1
        },params);*/
            var date = new Date();
            var all_sec = date.getTime();
            var chatContainer=$('.chat');
            var chat=chatContainer.find('div');
            //Lecture du fichier XML qui constitue le tchat       
            var lectureMessages = function(){
                //alert(all_sec);
                $.ajax({
                    type: "GET",
                    url: "chat.xml?time="+all_sec+"",
                    dataType: "xml",
                    beforeSend: function(xml) {
                        xml.setRequestHeader('Cache-Control', 'no-cache');
                        xml.setRequestHeader('Pragma', 'no-cache');
                    },
                    success:
                        function(xml){
                            chat.html('');
                            $(xml).find('shoutbox').each(  
                                function(){       
                                    var id = $(this).attr('id');
                                    var date = $(this).find('date').text();
                                    var pseudo = $(this).find('pseudo').text();
                                    var message = $(this).find('message').text();                           
                                    //alert(message);
 
                                    //$('<p id="message_'+id+'"></p>').html('<small>'+date+'</small> '+pseudo+' &gt; <strong>'+message+'</strong>').appendTo('div.chat');
                                    //$('<p id="message_'+id+'"><small>'+date+'</small> '+pseudo+' &gt; <strong>'+message+'</strong></p>').appendTo('div.chat');
 
 
                                    chat.append('<p id="message_'+id+'"><small>'+date+'</small> '+pseudo+' &gt; <strong>'+message+'</strong></p>');
                                    //chat.html( chat.html() + '<p id="message_'+id+'"><small>'+date+'</small> '+pseudo+' &gt; <strong>'+message+'</strong></p>');
                                    document.thequizz.themessage.focus();
                            });
                            //setTimeout(lectureMessages,params.refresh*1000);
                            //setTimeout('lectureMessages()',1000);
                            //setTimeout(lectureMessages.refresh*1000);
                            //refresh:1000;
                        }
                });
            }
                            $.timer({name:"Lecture", interval: 1}, function() {                                                   
                              lectureMessages();
                            });
            lectureMessages();
    }
})(jQuery)

et le code qui appelle la fonction :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
<div id="myChat">
        <div class="chat">
            <div></div>
        </div>
        <div class="online_member">
            <span class="buddy16"><img src="img/icones/robot.jpg" width="16" height="16" alt="'+pseudo+'" /><a href="#" onMouseOver="montre('vert', 'Robot', 'Trip Avenue', '100', 'Samedi 04 Avril 2009 18h00', 'robot.jpg');" onMouseOut="cache();"><span class="vert"><?php echo ANIMATEUR;?></span></a></span><br />
            <div></div>
        </div>
        <form method="post" class="writeInput" name="thequizz">
            <input type="text" value="" name="themessage" maxlength="60" />
        </form> 
    </div>
<script type="text/javascript">
    $(function(){
        $('#myChat').ajaxChat();
    });
    </script>

Merci d'avance

**danielhagnoul** · 20/04/2009, 19h53

Bonsoir.

Je ne connais pas le problème, mais une courte recherche sur Google m'a conduit à : http://www.clubic.com/forum/programm...048-page1.html

Donc sur Firefox et IE6*, ca fonctionne mais malheureusement sous IE7, ca bug car il utilise le cache malgré le setRequestHeader.

Je ne savais pas mais il suffisait de changer de méthode d'envoi. Contrairement à GET qui utilise le cache, POST ne l'utilise pas. Donc il a suffit que je remplace la ligne httpRequest.open("GET", url, false); par httpRequest.open("POST", url, false); et la problème a été résolu..