如何在SPA中強制進行全頁面導航而不是虛擬頁面導航

我們有一個單頁面應用程序，我們只是想確保用戶將始終使用最新版本的Web應用程序。如何在SPA中強制進行全頁面導航而不是虛擬頁面導航

我們簡單的解決方案雖然很冒險，但它可以檢測到所有錨點，並檢查自頁面加載大於24小時以來的時間。如果是我們想要執行「整頁」導航而不是「虛擬頁面」導航。也就是說，我們不是要去#contact-us而是不刷新頁面，我們想要發送用戶到http://website.com#contact-us刷新頁面的地方。

在下面的函數中，我可以檢測即將執行的'虛擬'導航。但是，我如何強制整頁導航和刷新？我是否應該將錨點href屬性更改爲完整的網站路徑，然後允許該事件傳播？或者我應該做window.location = ...;？

events: { 
     'click a[href!=""]': 'onClick' 
} 

onClick: function(ev) 
{ 
    try { 

     var now      = new Date() 
     , hoursSinceLastRefresh = Math.abs(now - this.lastRefresh)/36e5 
     , href     = ev.currentTarget.attr('href') 
     , isVirtualNavigation  = href.substr(0,1) === '#' 
     , pageExpired    = hoursSinceLastRefresh >= 24; 

     // if is internal navigation 
     if (isVirtualNavigation && pageExpired) 
      // How can I force a 'full page' navigation not a virtual navigation? 

    } 
    catch (ex) { 

    } 
}

PS：什麼是以下正確的術語：

當用戶點擊該鏈接<a href="#contact-us">頁面不刷新，但用戶「導航」在SPA了新的一頁。這是什麼意思？我一直在稱這個'虛擬頁面'導航。
當用戶點擊鏈接<a href="http://website.com#contact-us">時，頁面在SPA中刷新。這是什麼意思？我一直在稱這個'整頁'導航。

注我們<link ..>和<script ...>元素具有時間戳參數，以便在刷新頁面，他們會拉最新的Web應用程序文件。即，<script src="foo.js?t=201706031200" ...>。

來源

2017-06-03 Jake M

點擊一個錨定標記觸發[hashchange事件]（https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onhashchange）主動導航到另一個頁面會觸發[popstate event]（https://developer.mozilla.org/en-US/docs/Web/Events/popstate ）（除其他事項外）。也許看看[Window.location]的文檔（https://developer.mozilla.org/en-US/docs/Web/API/Window/location）。它可能會給你一些想法。 – Brice

events: { 
 
     'click a[href!=""]': 'onClick' 
 
} 
 

 
onClick: function(ev) 
 
{ 
 
    try { 
 

 
     var now      = new Date() 
 
     , hoursSinceLastRefresh = Math.abs(now - this.lastRefresh)/36e5 
 
     , href     = ev.currentTarget.attr('href') 
 
     , isVirtualNavigation  = href.substr(0,1) === '#' 
 
     , pageExpired    = hoursSinceLastRefresh >= 24; 
 

 
     // if is internal navigation 
 
     if (isVirtualNavigation && pageExpired){ 
 
      href.reload(true); 
 
     } 
 
    } 
 
    catch (ex) { 
 

 
    } 
 
}

來源

2017-06-03 02:51:24 Brice

感謝您的評論和答覆。 'href.reload（true）'不會重載當前頁面，而不是用戶試圖導航到的頁面？ –

我不這麼認爲，因爲你是不是將'var href'設置爲你正在點擊的錨點標記的href屬性的值： 'href = ev.currentTarget.attr（' href'）'？ – Brice

只是做一個window.location=...和瀏覽器將完成剩下的）

來源

2017-06-07 09:18:40 vassiliskrikonis

如何在SPA中強制進行全頁面導航而不是虛擬頁面導航

回答

相關問題