Skip to content

Fastly & Caching

Jonathan Flynn edited this page May 23, 2022 · 11 revisions

WARNING: Do not cache routes serving personal data!

As MMA displays sensitive information, only static assets are cached both in

  • Fastly, and in
  • application itself via the Cache-Control header in server.ts. Make sure to put sensitive route under disableCache middleware call.

As of this date, static assets are no longer served from our ECB servers, and rather stored and served from an S3 bucket called manage-frontend-static. Rules have been set in Fastly to point to this new bucket. The reason for this change was due to a number of chunkload errors, i.e.: the client requesting a javascript file (e.g.: 277.1b33cd48146f612223fb.js) and the server would return a 404 error. These 404 errors were happening with each new deployment. During deploy, webpack would generate new javascript files/bundles, each with a unique ID. These would then replace the old javascript bundles on the server, the client would then request the old javascript file/bundle which would result in the 404.

Force PASS (do not cache) by default on all routes, unless route is explicitly enabled to be cacheable:

image

To enable caching explicitly for a route newroute:

  1. Modify VCL condition to req.url !~ "^/(static|newroute)"
  2. Add the route above disableCache middleware in server.ts or override cache-control headers on case-by-case basis.

Relevant links

Fastly and manage-frontend integration

Like many of the frontend platforms at the Guardian we use Fastly CDN.

We don't have complicated VCL and so everything has been done via Fastly UI, that said version controlling the generated VCL alongside our code wouldn't be a bad idea (we of course have version control via the Fastly UI). Notable things are...

  • Healthcheck configured (/_healthcheck must be 200, checked every 60 seconds)
  • Force TLS and enable HSTS
  • Sets geolocation set-cookie headers for all PROD and CODE traffic (VCL snippet)
  • Force PASS (no caching) by default on all endpoints (except static currently)
  • GZIP enabled on any cached resources (see #183) which should only be /static/ content (primarily the client-side bundle user.js)
  • Logging into gu-reader-revenue-logs S3 bucket

We have a project in Fastly for CODE too, which can be used to test configurations before PROD. Not also that https://manage.code.dev-theguardian.com/ is accessible from anywhere, unlike say https://support.code.dev-theguardian.com/ which is only available from the office IP.

How to make changes in Fastly?

  1. Might be best to make changes to VCL indirectly via UI instead of directly writing VCL code.
  2. First try all changes via CODE service manage.code.dev-theguardian.com
  3. Go to Configure tab https://manage.fastly.com/configure
  4. Switch service to manage.code.dev-theguardian.com
  5. Edit Configuration and Clone
  6. A Draft version should be created, for example Draft version
  7. Add informative comment describing the change Comment
  8. Make changes
  9. Double check Diff versions
  10. Perhaps link the diff to a PR if possible
  11. After peer review, Activate.
  12. Repeat for PROD.
Clone this wiki locally