Может ли кто-нибудь объяснить этот код хранения сеанса?

Question

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

//Load Content from Cache if this is not a Refresh or new Page Load 
     if ((document.referrer!=null)&&(sessionStorage.getItem('lastReferrer')!=document.referrer)){ 
      if (('sessionStorage' in window) && (window['sessionStorage'] !== null)) { 
      if ('@Name'+window.location.href in sessionStorage){ 
       $("#@Name").html(sessionStorage.getItem('@Name'+window.location.href)); 
       $(window).scrollTop(sessionStorage.getItem('@Name'+'ScrollPos'+window.location.href)); 
       jQuery.data($('#ResponderScripts')[0],'cs_page',sessionStorage.getItem('@Name'+'Page'+window.location.href)); 
       jQuery.data($('#ResponderScripts')[0],'cs_totalPages',sessionStorage.getItem('@Name'+'TotalPage'+window.location.href)); 
       pageLoadedFromCache=1; 
       console.log('Replaced from Cache: @name url='+window.location.href+' referrer='+document.referrer+' page='+$('#ResponderScripts').data("cs_page")); 
      } 
      } 
     }; 

     // Save Component Content when leaving the page. 
     $(window).unload(function() { 
      history.replaceState({}, document.title,window.location.href); 
      if (('sessionStorage' in window) && (window['sessionStorage'] !== null)) { 
      var componentContent = $("#@Name").html(); 
      if (componentContent!=null){ 
       sessionStorage.setItem('@Name'+window.location.href, componentContent); 
       sessionStorage.setItem('@Name'+'ScrollPos'+window.location.href,$(window).scrollTop()); 
       sessionStorage.setItem('@Name'+'Page'+window.location.href,$('#ResponderScripts').data("cs_page")); 
       sessionStorage.setItem('@Name'+'TotalPage'+window.location.href,$('#ResponderScripts').data("cs_totalPages")); 
       console.log('stored @name url='+window.location.href+' referrer='+document.referrer+' page='+sessionStorage.getItem('@Name'+'Page'+window.location.href)); 
      } 
      } 
     }); 

Спасибо, спасибо за помощь! Если это не место для этого, дайте мне знать, и я могу его удалить.

Answer 1

Этот сниппет кажется довольно ясным и продуманным для меня, но я разлагаю то, что происходит.

if ((document.referrer != null) && (sessionStorage.getItem('lastReferrer') != document.referrer)) 

Итак, здесь мы определяем, является ли сеанс непрерывным. Оператор оценивает значение true, если реферер и последний известный реферер сеанса отличаются.

if (('sessionStorage' in window) && (window['sessionStorage'] !== null)) 

Здесь мы определяем, является ли sessionStorage даже вещью в браузере и установлена ​​ли она. Возвращает true, если он доступен и установлен. Я бы переместил это за пределы реферальной проверки на предмет безопасности (возможен нулевой или неопределенный доступ).

if ('@Name'+window.location.href in sessionStorage) 

Теперь мы определяем, имеет ли сама страница свойство в sessionStorage. Если это так, загрузите содержимое, хранящееся в sessionStorage, а не загрузите страницу.

Следующий раздел еще проще. Он регистрирует функцию обратного вызова , которая вызывается, когда страница разгружается (навигация, закрытие браузера и т. Д.). Эта функция выполняет history.replaceState() и определяет, доступна ли sessionStorage (снова). Если это так, он сохраняет кучу информации о состоянии для перезагрузки в следующий раз при доступе к странице.

Единственное, что я сделал бы, это обернуть логику сохранения и загрузки в sessionStorage check. Если sessionStorage недоступен, зачем тратить время на другие условные условия? Обратите внимание, что это в контексте фрагмента и может не сработать для вас в контексте полного приложения.

Answer 2

Этот код предназначен для сохранения страницы (с разбивкой по страницам?) В локальном хранилище, чтобы ее можно было восстановить из кеша. Я переписал его таким образом, что, надеюсь, добавит ясности.

var currentUrl = window.location.href; 

// ************************************** 
// Set some keys that can be used to access the localstore cache 
// ************************************** 
var lastHTMLContent_key = '@Name' + currentUrl; 
var lastScrollPosition_key = '@Name' + 'ScrollPos' + currentUrl; 
var lastPage_key = '@Name' + 'Page' + currentUrl; 
var lastPageTotal_key = '@Name' + 'TotalPage' + currentUrl; 
// ************************************** 

var $ResponderScripts = $('#ResponderScripts'); 
var $Target = $("#@Name"); 

// ************************************** 
// Some tests to determine if we can successfully retrieve an item from the cache 
// Note: Moved here for clarity. It is actually important to do these tests in a 
// way that prevents null references. 
// ************************************** 
var isSessionStorageAvailable = ('sessionStorage' in window && window['sessionStorage'] !== null); 
var isNewReferrer = (document.referrer != null && document.referrer != sessionStorage.getItem('lastReferrer'); 
var isURLInStore = (lastHTMLContent_key in sessionStorage); 
// ************************************** 

// ************************************** 
// Load Content from Cache if this is not a Refresh or new Page Load 
// ************************************** 
if (isSessionStorageAvailable && isNewReferrer && isURLInStore) { 

    pageLoadedFromCache = 1; 

    // ************************************** 
    // Fetch prior cached content 
    // ************************************** 
    var lastHTMLContent = sessionStorage.getItem(lastHTMLContent_key); 
    var lastScrollPosition = sessionStorage.getItem(lastScrollPosition_key); 
    var lastPage = sessionStorage.getItem(lastPage_key); 
    var lastPageTotal = sessionStorage.getItem(lastPageTotal_key); 
    // ************************************** 

    // ************************************** 
    // Set current content/context based on prior 
    // ************************************** 
    $Target.html(lastHTMLContent); 
    $(window).scrollTop(lastScrollPosition); 
    jQuery.data($ResponderScripts[0], 'cs_page', lastPage); 
    jQuery.data($ResponderScripts[0], 'cs_totalPages', lastPageTotal); 
    // ************************************** 

    console.log('Replaced from Cache: @name url=' + currentUrl + ' referrer=' + document.referrer + ' page=' + $('#ResponderScripts').data("cs_page")); 
} 
// ************************************** 

// ************************************** 
// Save Component Content when leaving the page. 
// ************************************** 
$(window).unload(function() { 

    history.replaceState({}, document.title, currentUrl); 

    if (isSessionStorageAvailable) { 
     var targetHTML = $Target.html(); 
     if (targetHTML != null){ 

      // ************************************** 
      // Save existing content for next time... 
      // ************************************** 
      sessionStorage.setItem(lastHTMLContent_key, targetHTML); 
      sessionStorage.setItem(lastScrollPosition_key, $(window).scrollTop()); 
      sessionStorage.setItem(lastPage_key, $ResponderScripts.data("cs_page")); 
      sessionStorage.setItem(lastPageTotal_key, $ResponderScripts.data("cs_totalPages")); 
      // ************************************** 

      console.log('stored @name url=' + currentUrl + ' referrer=' + document.referrer + ' page=' + $('#ResponderScripts').data("cs_page")); 

     } 
    } 

}); 
// ************************************** 

Я думаю, что это, как я мог бы приблизиться к более сложным если:

if (
    window.sessionStorage && // we can work with sessionStorage 
    sessionStorage[lastHTMLContent_key] && // a value for this page is in the store 
    document.referrer && // there is a referrer 
    document.referrer != sessionStorage.getItem('lastReferrer') // the referrer is not the last referrer 
) { 
    // proper to use cache page data 
}