我有一个应用程序,我还需要离线使用它。我在客户端上使用 Javascript/Jquery 构建动态内容与在服务器上构建动态内容没有问题,但我坚持使用基本页面布局。
现在我的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 --->
我正在使用,当通过 Ajax 请求后续页面时Jquery Mobile
,它会加载完整的第一页,head
然后不再使用标题。因此,我正在检查该页面是否是通过 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 请求页面时,我只包含 Facebook Open Graph 元数据。这样,如果 Google 请求该页面,该页面就会通过 W3C 验证。
现在挑战......如何使这个静态和离线可用。
我已经考虑了一段时间,并没有真正想出一个好的解决方案。如果我
- 提供整个页面 = 我未通过 W3C 验证,在线用户在每个页面请求上都会受到 8k 的罚款(是的,它是 gzip 压缩的,但仍然如此)
- 提供没有标题的页面 = 不是一个真正的选项
- 提供两个版本的页面(一个用于在线,一个用于离线使用)= 离线页面将被缓存,用户将被缓存中的那个版本“卡住”,即使他在线。
- 仅制作带有完整页眉的第一页 = 从第一页以外的页面开始的用户将位于损坏的页面(无页眉)。主页也未能通过验证。
我敢肯定,我不能拥有一切,但我想知道可以采取哪种方法以最好的方式做到这一点。
感谢您的投入!