如何爲在線和離線應用程序提供相同的HTML頁面？

我有一個應用程序，我需要也可以離線使用。我用JavaScript/Jquery在服務器上構建客戶端動態內容與在服務器上構建動態內容沒有關係，但我堅持使用基本的頁面佈局。如何爲在線和離線應用程序提供相同的HTML頁面？

現在我server-only頁面結構是這樣的（我使用Coldfusion）：

<cfsavecontent variable="renderedResults"> 
    <!--- Doctype ---> 
    <cfinclude template="../templates/tmp_pagetop.cfm"> 
    <cfoutput><head></cfoutput> 
    <cfif NOT isAjaxRequest()> 
     <!--- page header with all meta/js/css/icons... ---> 
     <cfinclude template="../templates/tmp_pageheader.cfm"> 
    </cfif> 
    <cfoutput> 
      <title>#variables.title# | #tx_select_title#</title> 
     </head> 
     <body> 
     // page 
     </body> 
    </html> 
    </cfoutput> 
</cfsavecontent> 

<!--- COMPRESS ---> 
<cfscript> 
    compressedHTML = reReplace(renderedResults, "\>\s+\<", "> <", "ALL"); 
    compressedHTML = reReplace(compressedHTML, "\s{2,}", chr(13), "ALL"); 
    compressedHTML = reReplace(compressedHTML, "\s{2,}", chr(09), "ALL"); 
    variables.alredayBinary = "false"; 
</cfscript> 
<!--- GZIP ---> 
<!--- SET HEADER ---> 
<!--- SEND BACK --->

我使用Jquery Mobile，這與全head加載的第一頁，然後永遠不再使用的頭，當通過Ajax請求後續頁面時。因此，我正在檢查是否通過Ajax請求頁面，如果是這樣，我會在隨後的頁面請求中向客戶端發送8k的標頭，因爲它們不被JQM使用。

而且，我的頭模板包括像這樣的很多條件內容：

<cfif structKeyExists(cgi, "HTTP_USER_AGENT") AND findNoCase("facebook", cgi.http_user_agent) NEQ 0> 
    <cfoutput> 
     <meta property="og:title" content="#variables.title#"/> 
     <meta property="og:type" content="website"/> 
     <meta property="og:url" content="#variables.base#" /> 
     <meta property="og:site_name" content="#variables.user_firma#"/> 
     <meta property="og:description" content="#variables.user_fbds#"/> 
     <meta property="fb:admins" content="#variables.user_fbadmin#" > 
    </cfoutput> 
</cfif>

所以我只包括了Facebook的Open Graph元，當頁面由Facebook的要求。通過這種方式，如果Google請求，該頁面將通過W3C驗證。

現在挑戰...如何使這種靜態和可用脫機。

我一直在想它，而不是真的想出一個好的解決方案。如果我

即成整頁=我失敗了W3C驗證和在線用戶獲得 8K點球（是的，它gzip壓縮，但仍然）在每個頁面請求
無頭=不是一個真正的選項來提供網頁
提供頁面的兩個版本（一個用於在線，一個用於離線用法）=離線頁面將被緩存，並且用戶將從該緩存「卡住」該版本，即使他在線也是如此。
只有完整頭文件=第一頁以外的頁面開始的第一頁纔會出現在損壞的頁面上（無標題）。主頁也驗證失敗。

我敢肯定，我不能擁有這一切，但我想知道可以採取哪種方法以最好的方式做到這一點。

感謝您的意見！

來源

2012-12-20 frequent

你是指什麼離線？ – blueberryfields

脫機，就像沒有網絡連接一樣運行。 – frequent

您可以設置一個會話變量來表示標題已加載。然後，在每個頁面上檢查該變量，如果它在那裏，則只顯示內容;如果它不在那裏，請顯示頭+內容。

來源

2012-12-20 21:52:00 Shomz

mh。聽起來是一個好主意。謝謝！ – frequent

沒問題！ :)它應該讓你在離線頁面的正確軌道上。 – Shomz

如何爲在線和離線應用程序提供相同的HTML頁面？

回答

相關問題