Как сохранить/кешировать дом, чтобы страница загружалась как есть, когда вы нажимаете кнопку «Назад»?

Question

Я добавляю модели в мою коллекцию моделей приложений js, используя вызовы ajax. когда я нажимаю модель и перехожу на следующую страницу, я хочу, чтобы все модели, которые я загрузил, все еще были там, когда я нажимал кнопку «Назад». Каков наилучший способ сделать это, чтобы он работал на всех браузерах? это для мобильной сети. Я не могу найти прямой ответ, как я могу использовать bfcache или историю js, или есть другой, лучший способ?

Answer 1

Вы можете хранить их в локальном хранилище и AJAX для них только тогда, когда не существует на локальном хранилище

Таким образом, вместо того, чтобы использовать регулярный $ .ajax, использовать это для Аякса, который вы хотите закэшированный:

function storageBasedAjax(url,cb){ 

    if (localStorage.getItem("myAxaxCache_"+url)){ 
     cb(localStorage.getItem("myAxaxCache_"+url)); 
     return; 
    }  

    $.ajax({url: url, success: function(result){ 
    localStorage.setItem("myAxaxCache_"+url,result); 
     cb(result); 
    }}); 
} 

Просто помните, что вы не хотите, чтобы над нагрузкой, поэтому если у вас есть URL с параметром меняющегося каждый вызов, не используйте это или вы будете перегружать локальное хранилище