web-dev-qa-db-fra.com

Forcer le rechargement/l'actualisation en appuyant sur le bouton Précédent

Je vais essayer de mon mieux pour expliquer cela. 

J'ai une application qui montre les 50 projets et plus dans ma page view. L'utilisateur peut cliquer sur le projet individuel et accéder à la page update pour mettre à jour les informations du projet. Tout fonctionne bien sauf que, une fois que l'utilisateur a fini de mettre à jour les informations du projet individuel et que le bouton 'Précédent' du navigateur est passé au view page précédent. Les anciennes informations sur le projet (avant la mise à jour) sont toujours là. L'utilisateur doit cliquer sur Actualiser pour voir les informations mises à jour. Ce n'est pas si grave, mais je souhaite offrir une meilleure expérience utilisateur. Une idée pour résoudre ça? Merci beaucoup.

phpmysqlcodeigniter
18
FlyingCat

Je pense que vous devez travailler avec JS pour que cela fonctionne, car il n'y a aucun moyen pour PHP de savoir à quels contrôleurs de navigateur l'utilisateur a accès ...

Cela aidera peut-être: http://www.hunlock.com/blogs/Mastering_The_Back_Button_With_Javascript

7
Loupax

Le "fb-cache" peut être vraiment ennuyeux. Voici un moyen javascript simple pour le contourner:

window.onpageshow = function(evt) {
    // If persisted then it is in the page cache, force a reload of the page.
    if (evt.persisted) {
        document.body.style.display = "none";
        location.reload();
    }
};

Testé dans Safari 6 et IE10.

17
abriggs

J'utilise ces quatre lignes de code PHP:

// any valid date in the past
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
// always modified right now
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
// HTTP/1.1
header("Cache-Control: private, no-store, max-age=0, no-cache, must-revalidate, post-check=0, pre-check=0");
// HTTP/1.0
header("Pragma: no-cache");

La clé utilise la clause "no-store" de l'en-tête Cache-Control.

17
phper

Heureusement, nous n'avons pas besoin de prendre en charge les navigateurs sous IE10. Par conséquent, si vous êtes suffisamment disposé ou autorisé à prendre en charge uniquement les navigateurs compatibles HTML5, les opérations suivantes devraient fonctionner:

/*
 * The following is intentional, to force Firefox to run 
 * this JS snippet after a history invoked back/forward navigation.
 */
window.onunload = function(){};    

function formatTime(t) {
    return t.getHours() + ':' + t.getMinutes() + ':' + t.getSeconds();
}

if (window.history.state != null && window.history.state.hasOwnProperty('historic')) {
    if (window.history.state.historic == true) {
        document.body.style.display = 'none';
        console.log('I was here before at ' + formatTime(window.history.state.last_visit));
        window.history.replaceState({historic: false}, '');
        window.location.reload();
    } else {
        console.log('I was forced to reload, but WELCOME BACK!');
        window.history.replaceState({
            historic  : true,
            last_visit: new Date()
        }, '');
    }
} else {
    console.log('This is my first visit to ' + window.location.pathname);
    window.history.replaceState({
        historic  : true,
        last_visit: new Date()
    }, '');
}

Eh bien, voici le code sans commentaires et sans graisse:

window.onunload = function(){};

if (window.history.state != null && window.history.state.hasOwnProperty('historic')) {
    if (window.history.state.historic == true) {
        document.body.style.display = 'none';
        window.history.replaceState({historic: false}, '');
        window.location.reload();
    } else {
        window.history.replaceState({historic  : true}, '');
    }
} else {
    window.history.replaceState({historic  : true}, '');
}

Collez-le juste avant la fermeture de votre balise, et vous obtiendrez une solution relativement propre.

Cela fonctionnera avec n'importe quelle combinaison de clic sur le bouton précédent/suivant, et au moment où l'utilisateur atterrira sur une nouvelle page, aucun rechargement forcé ne se produira.

En savoir plus sur l'objet History sur MDN:

MDN - L'objet d'histoire

MDN - Gestion de l'historique du navigateur

2
josef.van.niekerk

Eh bien, vous pouvez fournir un bouton arrière intégré sur la page de mise à jour qui leur enverra un nouveau message (comme un lien <a href="<?= $_SERVER['HTTP_REFERRER']; ?>">BACK</a> ou un script sur la page qui le forcera à extraire des données chaque fois que la page est affichée, que ce soit c'est une nouvelle impression, ou si le bouton de retour a été utilisé.

1
James

Aucune des solutions ci-dessus n'a fonctionné pour moi . Cette solution simple publiée ici a fonctionné ...

J'ai essayé de forcer le téléchargement d'une page à nouveau par le navigateur lorsque l'utilisateur clique sur le bouton Précédent, mais rien n'a fonctionné. Il semble que les navigateurs modernes disposent d’un cache distinct pour les pages, qui stocke l’état complet d’une page (y compris les éléments DOM générés par JavaScript). Ainsi, lorsque les utilisateurs appuient sur le bouton précédent, la page précédente s’affiche instantanément dans l’état que l’utilisateur a laissé. Si vous voulez forcer le navigateur à recharger la page sur le bouton précédent, ajoutez onunload = "" à votre élément de corps (X) HTML:

<body onunload="">

Cela désactive le cache spécial et force le rechargement de page lorsque l'utilisateur appuie sur bouton de retour. Réfléchissez à deux fois avant de l'utiliser. Fait d'avoir besoin d'un tel solution est un indice que votre concept de navigation du site est défectueux.

1
jahackbeth
 if (window.name == "reloader") {
            window.name = "";
            location.reload();
        }

window.onbeforeunload = function() {
                window.name = "reloader"; 
            }

Ajoutez ces deux fonctions dans chaque page

1
Rohit

voici une solution que ive utilisée dans certaines de mes pages. ajoutez ceci aux pages sur lesquelles les modifications sont effectuées.

window.onbeforeunload = function() {
     window.name = "reloader"; 
        }

cela se déclenche lorsque vous quittez ces pages. vous pouvez également le déclencher si des modifications ont été apportées. afin de ne pas recharger inutilement la page à recharger . puis sur les pages sur lesquelles vous souhaitez être rechargés après une utilisation "précédente" du navigateur.

if (window.name == "reloader")
      {
        window.name = "no";
        reloadPage(); 
      }

cela déclenchera un rechargement sur la page sur laquelle vous avez besoin de recharger vers ... espérons que cela vous aidera:)

1
gekong

C'est la solution que j'ai utilisée:

<?php
session_start();
if (!$_SESSION['reloaded']) {$_SESSION['reloaded'] = time();}
else if ($_SESSION['reloaded'] && $_SESSION['reloaded'] == time()) { ?> 
<script> 
location.reload(); 
</script> 
<?php } ?>
1
Paul Appleby

faire une case à cocher cachée et utiliser le code ci-dessous (coffeescript) 

window.location.reload()  if $("#refreshCheck")[0].checked
  $("#refreshCheck")[0].checked = true
0
Caner Çakmak

après des jours de recherche sur le net pour trouver une solution, je l'ai enfin trouvée, ajoutez après:

<script>
 window.onbeforeunload = function(){window.location.reload();}
</script>

cela fonctionnera comme un charme vous me remercierez

ce code rechargera la page chaque fois que vous la visiterez.

0
mhd