Предотвращение загрузки сафари из кеша при нажатии кнопки "Назад"
Появилась проблема с загрузкой старых видеороликов с загрузкой сафари при нажатии кнопки "Назад". Я попытался добавить в тег body onunload = "(упомянутый здесь Предотвращение кеша на задней панели в Safari 5), но в этом случае он не работает.
Есть ли способ предотвратить загрузку Safari из кеша на определенной странице?
Ответы
Ответ 1
Ваша проблема вызвана кэшем back-forward. Предполагается сохранить полное состояние страницы, когда пользователь перемещается. Когда пользователь перемещается назад с помощью кнопки "Назад", вы можете быстро загрузиться из кеша. Это отличается от обычного кеша, который кэширует только HTML-код.
При загрузке страницы для bfcache onload
событие не будет запущено. Вместо этого вы можете проверить свойство persisted
события onpageshow
. Он установлен на значение false при начальной загрузке страницы. Когда страница загружается из bfcache, она имеет значение true.
Решение Kludgish - это принудительное перезагрузку при загрузке страницы из bfcache.
window.onpageshow = function(event) {
if (event.persisted) {
window.location.reload()
}
};
Если вы используете jQuery, выполните следующие действия:
$(window).bind("pageshow", function(event) {
if (event.originalEvent.persisted) {
window.location.reload()
}
});
Ответ 2
Да, браузер Safari не обрабатывает кеш кнопки назад/назад так же, как Firefox и Chrome. В частности, iframe, например, видео vimeo или youtube, кэшируется, хотя есть новый iframe.src.
Я нашел три способа справиться с этим. Выберите лучшее для своего дела.
Решения, протестированные на Firefox 53 и Safari 10.1
1. Определите, использует ли пользователь кнопку назад/вперед, затем перезагрузите всю страницу или перезагрузите только кешированные фреймы, заменив src
if (!!window.performance && window.performance.navigation.type === 2) {
// value 2 means "The page was accessed by navigating into the history"
console.log('Reloading');
//window.location.reload(); // reload whole page
$('iframe').attr('src', function (i, val) { return val; }); // reload only iframes
}
2. перезагружать всю страницу, если страница кэширована
window.onpageshow = function (event) {
if (event.persisted) {
window.location.reload();
}
};
3. удалить страницу из истории, чтобы пользователи не могли снова посещать страницу с помощью кнопок "назад/вперед"
$(function () {
//replace() does not keep the originating page in the session history,
document.location.replace("/Exercises#nocache"); // clear the last entry in the history and redirect to new url
});
Ответ 3
Все эти ответы - это немного взлома. В современных браузерах (сафари) только на работе onpageshow
,
window.onpageshow = function (event) {
if (event.persisted) {
window.location.reload();
}
};
но на медленных устройствах иногда вы увидите для второго секундного кэшированного представления, прежде чем он будет перезагружен. Правильный способ решения этой проблемы - правильно настроить Cache-Control на ответ сервера на один ниже.
'Cache-Control', 'no-cache, max-age=0, must-revalidate, no-store'
Ответ 4
Вы можете использовать привязку и посмотреть значение местоположения документа href;
Начните с http://acme.co/
, добавьте что-то в это место, например '#b';
Итак, теперь ваш URL-адрес http://acme.co/#b
, когда человек нажимает кнопку "Назад", он возвращается к http://acme.co
, а функция проверки интервалов видит отсутствие установленного хэш-тега, очищает интервал и загружает ссылающийся URL с прикрепленной к нему отметкой времени.
Есть некоторые побочные эффекты, но я оставлю вас, чтобы понять их;)
<script>
document.location.hash = "#b";
var referrer = document.referrer;
// setup an interval to watch for the removal of the hash tag
var hashcheck = setInterval(function(){
if(document.location.hash!="#b") {
// clear the interval
clearInterval(hashCheck);
var ticks = new Date().getTime();
// load the referring page with a timestamp at the end to avoid caching
document.location.href.replace(referrer+'?'+ticks);
}
},100);
</script>
Это непроверено, но оно должно работать с минимальной настройкой.
Ответ 5
Поведение связано с кешем Safari Back/Forward. Вы можете узнать об этом в соответствующей документации Apple: http://web.archive.org/web/20070612072521/http://developer.apple.com/internet/safari/faq.html#anchor5
Собственное решение Apple для Apple заключается в том, чтобы добавить на свою страницу пустой iframe:
<iframe style="height:0px;width:0px;visibility:hidden" src="about:blank">
this frame prevents back forward cache
</iframe>
(Предыдущий принятый ответ кажется действительно верным, просто хотел почистить документацию и другое потенциальное исправление)
Ответ 6
Прежде всего, вставьте код в свой код:
<input id="reloadValue" type="hidden" name="reloadValue" value="" />
затем запустите jQuery:
jQuery(document).ready(function()
{
var d = new Date();
d = d.getTime();
if (jQuery('#reloadValue').val().length == 0)
{
jQuery('#reloadValue').val(d);
jQuery('body').show();
}
else
{
jQuery('#reloadValue').val('');
location.reload();
}
});