6
<apex:page showHeader="false" sidebar="false" standardStylesheets="false"
docType="html-5.0" manifest="/apex/CacheManifest">
<header>
 <h1>Congratulations!</h1>
 </header>
 <article>
 <p>This page looks almost like HTML5!</p>
 </article>
 <img src="/img/seasonLogos/2013_summer_aloha.png" />
 </apex:page>

I created a page in the summer 13 pre-release org .Also i tried creating the CacheManifest file through vf

<apex:page contentType="text/cache-manifest" applyHtmlTag="false"
 standardStylesheets="false" showHeader="false">
CACHE MANIFEST
img/seasonLogos/2013_summer_aloha.png
</apex:page>

Here is the manifest file created through visualforce

I run into following error

Any idea on why this is happening?Am i missing something?

enter image description here

5
  • I've not done any HTML5, but with an HTML4 VF page, you'd have a line that looks like: <img src="{!URLFOR($Resource.ResourcePackageName,'img/seasonLogos/2013_summer_aloha.png')}"/> Perhaps your CacheManifest needs to refer to it's contents a bit more explicitly along similar lines?
    – crmprogdev
    Apr 27 '13 at 15:18
  • I dont think thats the issue here.I know as a best practice we need to refer from static resource but here its manifest related Apr 27 '13 at 15:21
  • My thought was, how does the manifest find the static resource if it's not fully referenced?
    – crmprogdev
    Apr 27 '13 at 15:34
  • manifest="/apex/CacheManifest" .The manifest attribute is meant for that and the second page is named as CacheManifest Apr 27 '13 at 15:37
  • Gotcha! Haven't had a need to use that (yet). I'd simply noticed that it's referenced in an entirely different way.:)
    – crmprogdev
    Apr 27 '13 at 18:00
6

Browsers are very picky about the format of cache manifest files - have you confirmed that yours parses correctly when not using the page attribute, i.e. by adding it to a regular HTML element?

Here's an example from one of my dev orgs:

VF page:

<apex:page controller="MyAppController"
           showHeader="false" sidebar="false" standardStyleSheets="false" cache="false">
    <html manifest="/apex/MyAppCache">

and then the cache page is as follows - note that the CACHE MANIFEST appears on the same line as the apex:page component - if I moved it down into its own line, I recall the browsers would reject that:

<apex:page showHeader="false" standardStylesheets="false" contentType="text/cache-manifest" cache="false">CACHE MANIFEST

NETWORK:
*

CACHE:

#js
{!URLFOR($Resource.JQuery_1_7_1)}
{!URLFOR($Resource.JQueryMobile_1_1_0, 'jquery.mobile-1.1.0/jquery.mobile-1.1.0.js')}
{!URLFOR($Resource.Knockout_2_1_0)}
{!URLFOR($Resource.Phonegap, 'phonegap-1.2.0-android.js')}
{!URLFOR($Resource.Phonegap, 'phonegap-1.2.0-ios.js')}
{!URLFOR($Resource.SFSmartStorePlugin)}
{!URLFOR($Resource.SFHybridAppJs)}

#css
{!URLFOR($Resource.JQueryMobile_1_1_0, 'jquery.mobile-1.1.0/jquery.mobile-1.1.0.css')}

#images
{!URLFOR($Resource.JQueryMobile_1_1_0, 'jquery.mobile-1.1.0/images/ajax-loader.png')}
{!URLFOR($Resource.JQueryMobile_1_1_0, 'jquery.mobile-1.1.0/images/icons-18-black.png')}
{!URLFOR($Resource.JQueryMobile_1_1_0, 'jquery.mobile-1.1.0/images/icons-18-white.png')}
{!URLFOR($Resource.JQueryMobile_1_1_0, 'jquery.mobile-1.1.0/images/icons-36-black.png')}
{!URLFOR($Resource.JQueryMobile_1_1_0, 'jquery.mobile-1.1.0/images/icons-36-white.png')}
/img/samples/light_green.gif
/img/samples/light_yellow.gif
/img/samples/light_red.gif

#sessionid to force reload cache everytime the app is online:{!GETSESSIONID()}
#This is done as a work around to a limitation of JS Remoting that causes remoting actions to fail on subsequent app login.
</apex:page>
7
  • Thanks and Brilliant!placing the CACHE MANIFEST beside page did the trick i believe.Thanks!!! Apr 29 '13 at 13:38
  • Just tried the above format and I am getting a problem with remoting method caching session id from last session. It does happen for the very first time you load the page after login and works fine afterwards. any idea ?
    – Avidev9
    Jan 7 '14 at 20:24
  • @Avidev9 did you solve this problem?
    – Phil B
    Jun 9 '14 at 21:03
  • @bob buzzard you didn't have to add VFRemote.js or any standard SF javascript files?
    – Phil B
    Jul 7 '14 at 13:26
  • No, because I wasn't using any of those - mine was all based around JQuery Mobile. You'll need to add the resources that you are using - my example was explaining the format. Jul 7 '14 at 13:27

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.