WOFF and WOFF2 Font Missing Cache-Control

  • Resolved Wasca

    (@wasca)


    4 years, 2 months ago

    I’m using nginx and have noticed that all my woff and woff2 font files loading from my cloudfront CDN do not have any cache-control settings.

    Below is the nginx config that W3Total Cache is building for me. Any idea why in my browser the Cache-Control column is empty for files like this…

    https://cdn.mywebsite.com/wp-content/themes/buddyboss-theme/assets/fonts/SFUIText-RegularItalic.woff

https://cdn.mywebsite.com/wp-content/plugins/buddyboss-platform/bp-templates/bp-nouveau/icons/bb-icons.woff2?80309866

    This is my nginx.conf file created by W3TC

    # BEGIN W3TC CDN
location ~ \.(ttf|ttc|otf|eot|woff|woff2|font.css)$ {
    expires 31536000s;
    etag on;
    if_modified_since exact;
    add_header Pragma "public";
    add_header Cache-Control "public";
    add_header X-Powered-By "W3 Total Cache/0.15.2";
    add_header X-Frame-Options "SAMEORIGIN";
    add_header X-XSS-Protection "1; mode=block";
    add_header X-Content-Type-Options "nosniff";
    add_header Referrer-Policy "no-referrer-when-downgrade";
    add_header Access-Control-Allow-Origin "*";
}
# END W3TC CDN
# BEGIN W3TC Browser Cache
gzip on;
gzip_types text/css text/x-component application/x-javascript application/javascript text/javascript text/x-js text/richtext text/plain text/xsd text/xsl text/xml image/bmp application/java application/msword application/vnd.ms-fontobject application/x-msdownload image/x-icon application/json application/vnd.ms-access video/webm application/vnd.ms-project application/x-font-otf application/vnd.ms-opentype application/vnd.oasis.opendocument.database application/vnd.oasis.opendocument.chart application/vnd.oasis.opendocument.formula application/vnd.oasis.opendocument.graphics application/vnd.oasis.opendocument.spreadsheet application/vnd.oasis.opendocument.text audio/ogg application/pdf application/vnd.ms-powerpoint image/svg+xml application/x-shockwave-flash image/tiff application/x-font-ttf audio/wav application/vnd.ms-write application/font-woff application/font-woff2 application/vnd.ms-excel;
location ~ \.(css|htc|less|js|js2|js3|js4)$ {
    expires 31536000s;
    etag on;
    if_modified_since exact;
    add_header Pragma "public";
    add_header Cache-Control "public";
    add_header X-Powered-By "W3 Total Cache/0.15.2";
    add_header X-Frame-Options "SAMEORIGIN";
    add_header X-XSS-Protection "1; mode=block";
    add_header X-Content-Type-Options "nosniff";
    add_header Referrer-Policy "no-referrer-when-downgrade";
    try_files $uri $uri/ /index.php?$args;
}
location ~ \.(html|htm|rtf|rtx|txt|xsd|xsl|xml)$ {
    expires 3600s;
    etag on;
    if_modified_since exact;
    add_header Pragma "public";
    add_header Cache-Control "public";
    add_header X-Powered-By "W3 Total Cache/0.15.2";
    add_header X-Frame-Options "SAMEORIGIN";
    add_header X-XSS-Protection "1; mode=block";
    add_header X-Content-Type-Options "nosniff";
    add_header Referrer-Policy "no-referrer-when-downgrade";
    try_files $uri $uri/ /index.php?$args;
}
location ~ \.(asf|asx|wax|wmv|wmx|avi|bmp|class|divx|doc|docx|exe|gif|gz|gzip|ico|jpg|jpeg|jpe|webp|json|mdb|mid|midi|mov|qt|mp3|m4a|mp4|m4v|mpeg|mpg|mpe|webm|mpp|_otf|odb|odc|odf|odg|odp|ods|odt|ogg|pdf|png|pot|pps|ppt|pptx|ra|ram|svg|svgz|swf|tar|tif|tiff|_ttf|wav|wma|wri|xla|xls|xlsx|xlt|xlw|zip)$ {
    expires 31536000s;
    etag on;
    if_modified_since exact;
    add_header Pragma "public";
    add_header Cache-Control "public";
    add_header X-Powered-By "W3 Total Cache/0.15.2";
    add_header X-Frame-Options "SAMEORIGIN";
    add_header X-XSS-Protection "1; mode=block";
    add_header X-Content-Type-Options "nosniff";
    add_header Referrer-Policy "no-referrer-when-downgrade";
    try_files $uri $uri/ /index.php?$args;
}
add_header X-Frame-Options "SAMEORIGIN";
add_header X-XSS-Protection "1; mode=block";
add_header X-Content-Type-Options "nosniff";
add_header Referrer-Policy "no-referrer-when-downgrade";
# END W3TC Browser Cache
# BEGIN W3TC Minify core
rewrite ^/wp-content/cache/minify/ /index.php last;
# END W3TC Minify core

    Other files like this…

    https://cdn.mywebsite.com/wp-content/plugins/buddyboss-platform/bp-templates/bp-nouveau/css/buddypress.min.css.gzip

    Have a Cache-Control value of max-age=31536000, public which I was expecting for the font files also.

Viewing 10 replies - 1 through 10 (of 10 total)
  • Plugin Contributor Marko Vasiljevic

    (@vmarko)

    Hello @wasca

    Thank you for your inquiry and I am happy to assist you with this.
    Can you please share your website URL?
    Can you also please check the AWS origin settings for any cache control headers directive?
    Thanks!

    Thread Starter Wasca

    (@wasca)

    Hi @vmarko

    Here is the URL: https://cmt.optuma.com/

    There are no AWS origin settings for for the bucket. There is a caching policy for the Cloudfront distribution.

    You can see the cache policy here

    View post on imgur.com

    Could it be because the “Initiator” is a .gzip file?

    https://cdn.cmt.optuma.com/wp-content/themes/buddyboss-theme/assets/fonts/fonts.css.gzip

    View post on imgur.com

    • This reply was modified 4 years, 2 months ago by Wasca.
    Plugin Contributor Marko Vasiljevic

    (@vmarko)

    Hello @wasca

    Thank you for the information.
    No, gzip should not cause this. Is the cache control set for fonts when CDN is disabled?
    Try adding the cache-control for fonts manually to the nginx.conf:

    location ~ \.(eot|ttf|woff|woff2)$ {
    expires 31536000s;
    etag on;
    if_modified_since exact;
    add_header Pragma "public";
    add_header Cache-Control "max-age=31536000, public";
}

    Thanks!

    Thread Starter Wasca

    (@wasca)

    When I turn off the CDN I am seeing the Cache-Control setting being added to the font files perfectly fine.

    View post on imgur.com

    As soon as I turn on the CDN (Host Custom Files option) then the WOFF and WOFF2 fonts do not have the Cache-Control settings applied to them.

    View post on imgur.com

    • This reply was modified 4 years, 2 months ago by Wasca.
    Thread Starter Wasca

    (@wasca)

    @vmarko what I’ve noticed is that the woff and woff2 files when getting uploaded to S3 via the Custom Files Export process are not getting the Cache-Control max-age=31536000, public Meta value added to that file.

    Here is what I’m seeing for the meta data for WOFF files

    View post on imgur.com

    This is what the meta values for a ttf file looks like once uploaded to S3

    View post on imgur.com

    • This reply was modified 4 years, 2 months ago by Wasca.
    Plugin Contributor Marko Vasiljevic

    (@vmarko)

    Hello @wasca

    Thank you for the information.
    Since the files are uploaded to S3 and not getting the cache-control, the problem is with the AWS and setting the header there.
    Please make sure to check the configuration on AWS dashboard.
    Thanks!

    falondrian

    (@falondrian)

    Hello, I have the same issue. I uploaded” wp-content/fonts/*.woff2″ via custom files list to S3. All fonts are missing the cache control header, EXCEPT for one font in the bucket, very strange behavior. I could verify the same behavior with another folder that has two fonts – one of the fonts has the header, the other doesn’t.

    Thread Starter Wasca

    (@wasca)

    I’m still having the same issue.

    I have noticed that the woff and woff2 files have a type of “octet-stream” instead of “woff” or “woff2” like some other font have.

    https://imgur.com/a/BO3hyl2

    These fonts appear to have the correct type set.

    https://imgur.com/pC2iYak

    Thread Starter Wasca

    (@wasca)

    @vmarko Does W3Total Cache set the “type” and “cache-control” when it uploads the files to S3? If so, I think that part is broken for WOFF and WOFF2 files. All other files seem to get the correct “type” and “cache-control” metadata added to them when W3Total Cache uploads them to S3.

    Thread Starter Wasca

    (@wasca)

    @vmarko I’m at a loss at how to get these WOFF and WOFF2 font files to appear in my S3 Buck with the Cache-Control header added. I would really appreciate it if you could test the process and see if you can get the WOFF and WOFF2 file listed in “Custom file list:” to appear in an S3 Buck with the Cache-Control set. You need to to test it with NGINX.

    Thanks

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘WOFF and WOFF2 Font Missing Cache-Control’ is closed to new replies.