HTML5 Cache Manifest problem - apache

I am trying to use it to cache all the static files for my application (images, JS etc.) but I am running into a problem. My cache manifest file can looks like this:
CACHE MANIFEST
CACHE:
templates/v2/css/somecss.css
templates/v2/js/somejs.js
templates/v2/images/someimages.jpg
NETWORK:
*
This does cache those files that I have added to it (a few hundred so I omitted most of them out) but it also caches pages that I don't want (ex. index.php). It dramatically lowers the loadtime of the whole application but I need it not to cache any php files. I am using MultiViews if that makes any difference.
I have also tried adding a list of the files that I don't want cached under network but it still caches them. The full file can be found at https://app.emailsmsmarketing.com/cache.manifest

The problem might not be with the manifest itself.
Are you adding the manifest attribute to all your php pages? That could be the issue.
The manifest attribute should be included on every page of your web
application that you want cached. The browser does not cache a page if
it does not contain the manifest attribute (unless it is explicitly
listed in the manifest file itself. This means that any page the user
navigates to that include a manifest will be implicitly added to the
application cache.
http://www.html5rocks.com/en/tutorials/appcache/beginner/#toc-manifest-file-reference

You can also specify the .php files which you do not want to be cached in the NETWORK section. WHichever file you specify here will be accessed from the server.
You can make use of wildcard i believe for all php files

Related

Nuxt JS - reading conf/env file in static site generation

My project with Nuxt JS is set with target:static and ssr: false.
This app need to connect to a local endpoint to retrieve some informations.
I have multiple endpoints and I need multiple instances of the app, every app must read only his endpoint.
The question is: how change the endpoint address for every app without rebuild everyone?
I tried with env file or a json file in the static folder (in order to have access to this file in the dist folder after the build process).
But if I modify the content of the env/json file in the dist folder and then reload the webpage (or also restart the web server that serve the dist folder), the app continue to use the original endpoint provided at the build time.
There is a way or I have to switch to server side rendering mode (which I would rather not use)?
Thank you!
When you use SSG, it will bundle your app at build time. Last time I checked, there was no hack regarding that. (I don't have the Github issue under my hand but it's a popular one)
And at the same time, I don't really see how it would be done since you want to mix something static and dynamic at the same time.
SSR is the only way here.
Otherwise, you may have some other logic to generate dynamic markup when updating your endpoints (not related to Nuxt) by fetching a remote endpoint I guess.
With the module nuxt content it's possible to create a folder "/content" in project directory and read json files from that directory.
After, when creating the dist with nuxt generate command, the "content" folder it's included in "_nuxt" folder of the dist and if you modify the content of the json file and refresh the webpage that read it, will take the new values.

Updating Last-Modified for static content served with Wildfly

I have a war with some static files (mostly images) in the webapp deployed on Wildfly. Sometimes the application needs to update some of those files, which then get replaced in the filesystem.
However Wildfly/Undertow seem to think that nothing has changed and the Last-Modified header in the response keeps showing the time before the update.
So I wonder what is Undertow using to determine the Last-Modified header shown. I've tried "touching" the parent directory, but to no effect.
In fact it looks like wildfly/undertow caches the last modified time after the first time it loaded a given resource.
Update
It's clearly a problem with the cache, since if I remove one of the files I requested before and request it again I get 500 Internal Server Error and stacktrace!
As pointed out in this thread the exploded war directory is not the right place for static resources that can be changed.
Instead one should use some other directory on the filesystem and configure the undertow subsystem to serve those pages. See for example this question.

Force re-download of file cached with cache.appcache

My question is similar to this one, but the solutions provided haven't helped me: Force applicationCache to reload cached files
Here's the run down. I currently have a sencha touch application hosted on S3, and there's a problem which requires an update to the index.html file.
In order to enable offline access to the app, I've cached index.html in cache.appcache. Below is my cache.appcache file:
CACHE MANIFEST
# 127476e50461cf415c27fb33d81914faab1fc687
index.html
# 364c8e0f0cc7c9922d0019d083b4abba7d519e1c
resources/images/ajax-loader.gif
# 4028c1082f32387af25e2399aae7173ed0a51cf4
resources/images/cloud_download.png
# 40454710d633ca15b65d891d3842d3ef8b2136bf
resources/images/delete1.png
# 62c6a1ec578fa7d1d7a3117c2a84c5195c33ddb8
resources/images/loading.png
# ad85882c6285881966307da8da97ff597de9a486
resources/images/loadingbg.gif
# d2abb7549cd282c1e3fec6e9249d1e51ad5ec75d
resources/images/logo.png
FALLBACK:
NETWORK:
*
In hindsight, to enable offline access I should have probably left index.html as a non-cached network file with a fallback to some 'offline.html' file, but the app's been deployed for a while, and I need to make a change to index.html, and I just can't get the file to update, not even on my local machine by clearing the cache, and not by using private browsing as per the link above. I need to be able to change the file without the user having to do anything to receive the changes.
Here's what I've tried:
1) I removed index.html from the cache manifest and uploaded it. When I did that, and reloaded, the browser picked up the updated cache manifest and downloaded the files:
Application Cache Progress event (0 of 6) http://m.example.com/resources/images/loading.png (index):1
Application Cache Progress event (1 of 6) http://m.example.com/resources/images/ajax-loader.gif (index):1
Application Cache Progress event (2 of 6) http://m.example.com/resources/images/cloud_download.png (index):1
Application Cache Progress event (3 of 6) http://m.example.com/resources/images/loadingbg.gif (index):1
Application Cache Progress event (4 of 6) http://m.example.com/resources/images/delete1.png (index):1
Application Cache Progress event (5 of 6) http://m.example.com/resources/images/logo.png (index):1
Application Cache Progress event (6 of 6) http://m.example.com/ (index):1
Thankfully that means the browser isn't caching the manifest file, but unfortunately, even though it downloaded the index, the file didn't update. I've confirmed the file has been properly uploaded to the s3 bucket, and if I download the file the changes are there, but even after reloading the browser, clearing the browser cache multiple times, viewing the source shows the old index.html file. Note if I go to http://m.example.com/?bla, it works, so I know s3 is serving the correct file (although I haven't ruled out an s3 request cache), but http://m.example.com/ is still broken.
I'm guessing that, although the appcache is redownloading the file, at the browser level it's still cached, so appcache is just downloading the browser's cached version, although clearing the browser cache doesn't fix the issue.
2) I never set any expires headers on the file in s3 so not sure if s3 sets really long expiration headers by default, but I've tried adding Expires: -1 to index.html but doesn't help.
3) I've also tried uploading a new file called index2.html, and changing the index document in the s3 bucket to index2.html, but still I'm getting the old copy.
Not only do I need to get this working on my dev machine, but I also need to fix the issue on existing user's browsers, ideally without them having to do anything. I'm starting to think my only option is changing the app url, which I'd really rather not do. The index page seems so hard wired into the browser I'm not sure if even pointing m.example.com to a new ip address would help. Anyone have any ideas how I could solve this?
Update: I tried looking in the network tab in the chrome console while at the same time pushing up a new cache manifest and reloading the page. Unfortunately cache manifest requests don't seem to show in the network tab even if they're being re-downloaded.
Ok so after a bit more searching I discovered some idiosyncrasies in appcache, like the fact that whatever page includes your cache manifest, is auto cached by default regardless of your settings. I would have thought that, if the manifest was updated, the browser would at least re-download index.html, but it appears not. I used the solution found in the link below which indicates a workaround where you attach your manifest to another page which you reference in your source page via iframe, therefore allowing index.html to be not cached again.
My HTML5 Application Cache Manifest is caching everything
After doing that, to avoid future caching issues I made a duplicate page at 'offline.html' and made a failover pointing index.html to offline.html. So basically index.html is now never cached and isn't going to leave me stranded with an unusable domain, and when offline it will redirect to the offline page which can be happily cached for offline access. Phew!

How does web server lists files in absence of index files in the directory

How do I customize the list that web server does in absence of index.* file in the web root or its child directory, if we do not put any index files in the web root directory and the directory has the read permission?
you can set the page to show for a directory url with the index directive, it doesn't need to point to something called index.*, might just as well be whatever.html. See http://nginx.org/en/docs/http/ngx_http_index_module.html#index for details
or you can set autoindex on to give a generated file/directory listing, you can use the autoindex_exact_size and autoindex_localtime to further customize that listing. See http://nginx.org/en/docs/http/ngx_http_autoindex_module.html for details
3th option, if your nginx is compiled with it, is the random_index, see http://nginx.org/en/docs/http/ngx_http_random_index_module.html for details.
NOTE: to find out if your nginx is compiled with the needed --with-http_random_index_module option use the command nginx -V
Well, it depends on what webserver you are using.
In case of Apache, direcory indexes handled by a module called mod_autoindex.
When you want to customize the directory listing, then you have to know that Apache need three 'view' files:
The Header — by default automatically generated by Apache The
Directory Listing — necessarily generated by Apache
The Footer — referred to as the “Readme” file
The Header and Footer parts are basically written in plain HTML. The directory listing is generated by Apache but you can apply CSS on it..
The whole thing is a rather long story, so what I can suggest is a well written article with the details about this 'directory listing customisation':
Better Default Directory Views with .htaccess

mod_rewrite to serve static cached files if they exist and if the source file hasn't changed

I am working on a project that processes images, saves the processed images in a cache, and outputs the processed image to the client. Lets say that the project is located in /project/, the cache is located in /project/cache/, and the source images are located wherever else on the server (like in /images/ or /otherproject/images/). I can set up the cache to mirror the path to the source image (e.g. if the source image is /images/image.jpg, the cache for that image could be /project/cache/images/image.jpg), and the requests to the project are roughly /project/path/to/image (e.g. /project/images/image.jpg).
I would like to serve the images from the cache, if they exist, as efficiently as possible. However, I also want to be able to check to see if the source image has changed since the cached image was created. Ideally, this would all be done with mod_rewrite so PHP wouldn't need to be used to do any of the work.
Is this possible? What would the mod_rewrite rules need to be for this to work?
Alternatively, it seems like it would be a fine compromise to have mod_rewrite serve the cached file most of the time but send 1 out of X requests to the PHP script for files that are cached. Is this possible?
You cannot acces the file modification timestamp from the RewriteRule, so there is no way around using PHP or another programming language for that task.
On the other hand this is really simple in PHP, so you should first check whether the PHP solution is good enough in you case. Only if it isn't you should look for alternatives.
What if you used the client to do some of the work? Say you display an image in the web browser and always use src="/cache/images/foobar.jpg" and add an onerror="this.src='/images/foobar.jpg'". In mod_rewrite, send anything that goes to the /images/ dir to a script that will return and generate an image in the cache.