Заставить Firefox перезагрузить страницу на кнопке "Назад"

Как заставить Firefox перезапустить JavaScript и перезагрузить всю страницу, когда пользователь нажимает кнопку "Назад"? Я смог сделать это во всех браузерах, кроме Firefox, с помощью другого вопроса SO, добавив этот код:

history.navigationMode = 'compatible';
$("body").unload(function(){})

А также добавление iFrame... Но это не работает в Firefox. Есть что-нибудь сделать?

8 ответов

Решение

Добавьте это между вашими тегами HEAD

<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="-1">

В моем случае, после того, как конечный пользователь опубликует свои новые данные на сервере, он будет перенаправлен на другую страницу. Но когда конечный пользователь нажимает кнопку "Назад", форма заполняется старыми данными. Итак, перезагрузка страницы необходима.

Я сделал обходной путь для Firefox и еще один для Google Chrome. Они имеют различное поведение для отображения кэшированных страниц.

Это не позволит Firefox кэшировать страницу, а кнопка "Назад" выведет страницу с сервера.

window.onunload = function(){};

Но Google Chrome делает это по-другому, и приведенное выше решение не работает для меня. Поэтому я сделал еще один обходной путь для Chrome. Я сделал флаг, который помечает форму как грязную.

На вершине <head>перед загрузкой проверяю куки

if(document.cookie.match(/my-form=dirty/)) {
  document.cookie = "my-form=; expires=-1; path="+document.location.pathname;
  window.location.reload();
}

С помощью jQuery я пишу куки, когда пользователь что-то изменяет

$(document).load(function(){
  $(':input').change(function(){
    document.cookie = "my-form=dirty; expires=86400000; path="+document.location.pathname;
  })
})

Хорошо знать:

Это решение сработало для меня (и я считаю, что это немного проще, чем другие решения):

    $(window).bind('pageshow', function() {
        // This event is called only by FireFox. Because Firefox doesn't reload the page when the user uses the back button,
        // or when we call history.go.back(), we need to force the reload for the applicatino to work similar to Chrome and IE (11 at least).

        // Doc: https://developer.mozilla.org/en-US/docs/Listening_to_events_in_Firefox_extensions
        location.reload();
    }); 

Я вызываю этот код на каждой странице загрузки, если браузер FireFox. (Чтобы узнать, работает ли в данный момент браузер Firefox, смотрите здесь).

Для справки, это свойство navigationMode применимо только к Opera, просто браузеры IE и Webkit уже ведут себя так, как хотелось спрашивающему.

IE и Webkit делают то, что Opera называет "совместимой" навигацией. Firefox делает то, что Opera назвала бы "быстрой" навигацией. Но только в Opera это поведение на самом деле контролируемо.

Добавьте это в ваш файл. Очистите кеш перед проверкой.

<?php
 header("Cache-Control: private, no-store, max-age=0, no-cache, must-revalidate, post-check=0, pre-check=0");
 header("Pragma: no-cache");
 header("Expires: Sat, 26 Jul 1997 05:00:00 GMT");
?>

чтобы добавить заголовки в JavaScript, пожалуйста, прочитайте это.

https://developer.mozilla.org/en-US/docs/Web/API/Headers/append

Вы можете использовать этот скрипт, чтобы найти здесь:

http://www.easy-coding.de/wiki/html-ajax-und-co/onload-event-cross-browser-kompatibler-domcontentloaded.html

Демо: http://demo.easy-coding.de/javascript/onload-event-cross-browser/

Источник: http://www.easy-coding.de/wiki/html-ajax-und-co/onload-event-cross-browser-kompatibler-domcontentloaded.html

Этот скрипт находится под свободной лицензией MIT/GPL.

В противном случае вы можете использовать специфичное для Gecko событие DOM: DOMContentLoaded

Ничто из этого не сработало для меня. Я делаю это с помощью проверки файлов cookie - я импортирую jsp (источник ниже) в верхнюю часть страницы, а затем вызываю refreshOnBack.

<%@ page import="java.util.UUID" %>
<script>
    var REFRESH_PAGE_COOKIE_NAME="refreshPage_";
    var PAGE_REFRESH_GUID = "<%out.print(UUID.randomUUID().toString());%>";  
    /* To force refresh of page when user or javascript clicks "back",
     * put call to this method in body onload function - NOT THROUGH JQUERY 
     * as jquery onload is not called on history back.
     * In must be done via <BODY onload="...">
     */
    function refreshOnBack(){
        //Alghoritm uses cookies to check if page was already loaded.
        //Cookies expiration time is not set - will be gone after browser restart.
        //Alghoritm:
        //is cookie set? 
        // -YES - reload;
        // -NO - set it up;
        //Cookie contains unique guid in name so that when page is regenerated - it will not reload.
        var cookieName = REFRESH_PAGE_COOKIE_NAME + PAGE_REFRESH_GUID; 
        if(getCookie(cookieName)=="Y"){
            window.location.reload();
        } else {
            setCookie(cookieName,"Y");
        }
    }   
</script>

Я думаю, что ответ, который вы, возможно, захотите, здесь: /questions/26729270/kak-kontrolirovat-keshirovanie-veb-stranits-vo-vseh-brauzerah/26729286#26729286

TLDR: HTTPS + Cache-Control: must-revalidate как отправленный сервером заголовок + Expires заголовок, установленный в прошлом, должен заставить его работать. Вот пример реализации PHP:

<?php

$expires = gmdate( 'D, d M Y H:i:s', time() - 1 );

header( 'Cache-Control: must-revalidate' );
header( "Expires: {$expires} GMT" );

?>
<!DOCTYPE html>
<html>
    <head>
        <title>Auto-reloading page</title>
    </head>
    <body>
        <p>The current day is <?php echo date( 'd, F Y'); ?> and the time is <?php echo date('H:i:s'); ?>.</p>
        <p><a href="http://google.com">Click away</a></p>
    </body>
</html>

Если вы используете C# .Net, вы можете обработать это на странице загрузки или события инициализации программно

Response.Cache.SetExpires(DateTime.Now.AddSeconds(-1));
Response.Cache.SetCacheability(HttpCacheability.Public);
Response.Cache.SetValidUntilExpires(false);
Response.Cache.VaryByParams["*"] = true;

Для получения дополнительной информации, проверьте Response.Cache на MSDN: http://msdn.microsoft.com/en-us/library/system.web.httpresponse.cache(v=vs.110).aspx

Другие вопросы по тегам