Cache Problems

support
1

Hey,

i’ve again massive Problems with my files in the static folder.

each css, js file will not be reload (for example - visitors without “private” browser mode)

my htaccess file has the following entries:

    # DISABLE CACHING
<IfModule mod_headers.c>
    Header set Cache-Control "no-cache, no-store, must-revalidate"
    Header set Pragma "no-cache"
    Header set Expires 0
</IfModule>
<FilesMatch "\.(css|flv|gif|htm|html|ico|jpe|jpeg|jpg|js|mp3|mp4|png|pdf|swf|txt)$">
    <IfModule mod_expires.c>
        ExpiresActive Off
    </IfModule>
    <IfModule mod_headers.c>
        FileETag None
        Header unset ETag
        Header unset Pragma
        Header unset Cache-Control
        Header unset Last-Modified
        Header set Pragma "no-cache"
        Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
        Header set Expires "Thu, 1 Jan 1970 00:00:00 GMT"
    </IfModule>
</FilesMatch>

i’ve nothing in my meta tags.

is there an other solution, do i miss anything ?

structure for my css/js files is:

-Site
– theme
— mytheme
---- static
----- css
----- js
----- frameworkCss
----- fonts

Is it possible to create (if generate the site) an additional hash at the end of the files? like an cms system who caches all these things? (example: css/mystyle6ztetgdu2kds7832.css)

Thanks for your support
Andy

2

The way I understand you, you want to reload the CSS file every time? Did you try removing all the stuff you posted of your .htaccess? If it’s just about the css files then remove the css| part of your code.

1 Like
3

Just have a look here: Fingerprint | Hugo

With your CSS in assets/css/:

{{ $styles := resources.Get "css/main.css" | minify | fingerprint }}
<link rel="stylesheet" href="{{ $styles.Permalink }}" integrity="{{ $styles.Data.Integrity }}" media="screen">

or just:

{{ $styles := resources.Get "css/main.css" | minify | fingerprint }}
<link rel="stylesheet" href="{{ $styles.Permalink }}" media="screen">
2 Likes
4

Yes, i’ll edit the htaccess. Thank you!

5

This sound verry good! My hope is that the server understands a change of the file. It’s crazy, but on some devices (without private mode, or manually cache cleaning, the css style stays does’nt change, same with jpg) is it better to put all “dynamic css” files to the assets folder?

6

Yes. If you use the fingerprint function (see above), that will effectively handle the cache busting for you.

1 Like
7

It works! How often will hugo generate the cash new? I’ve edit the css file, but the hash is the same. Are they settings to change that? After each editing?

Is this all in the cache part of the config file? Best Value for that eg. maxAge = -1 ?

Thanks a lot for all your help!!!
Andreas

8

One last question…

Is it possible to do that with “images”. put to the asset folder, create a hash etc.

I’m using hugo as a One Pager without “blog” elements and only a data sheet from json/toml to get fresh data…

Thanks
Andy

9

I don’t see why it shouldn’t.

1 Like
10

Hi,
if i edit an image and save this image with the same name etc. sometimes the webbrowser does‘nt register that. so some people have the same image like the last visit. (if they don‘t clear rhe cache of there browser).

Do i think here in a wrong way? Is this again more a problem of the headers? the cache control?

Thank you
Andy

11

Not sure if you’re overthinking or I’m not thinking enough.

The fingerprint can also be used in resources like images. Processed images will also be named like image_hu3d03a01dcc18bc5be0e67db3d8d209a6_1055507_1200x600_fill_q75_box_smart1.jpg.

AFAIK, there’s nothing more on Hugo side to prevent cache problems. ¯_(ツ)_/¯