Skip to main content

Surrogate Key Based Cache Purging

Before You Begin​

You should be familiar with the concept of surrogate key based caching and purging.

See https://docs.fastly.com/en/guides/working-with-surrogate-keys for more information on working with surrogate keys.

This guide uses WordPress with the WPGraphQL plugin, WPGraphQL Smart Cache plugin and the Pantheon Advanced Page Cache plugin installed.

How It Works​

The GraphqlClientFactory class from our @pantheon-systems/wordpress-kit npm package adds the Pantheon-Skey header to each request and uses the GET method by default to take advantage of WPGraphQL Smart Cache network caching. Responses from WordPress will contain the Surrogate-Key header. With these keys, your frontend can be instructed to purge content from a cache when the content in WordPress changes.

How To Ensure Headers Are Set On Custom Routes​

note

The Decoupled Kit WordPress Back-end Starter Project and WordPress Next.js Starter Kit handle the configuration below automatically.

  • The WordPress backend has the WPGraphQL plugin installed and configured
  • The WordPress backend has the WPGraphQL Smart Cache plugin installed and configured, with the Object Cache option disabled
  • The WordPress backend has the Pantheon Advanced Page Cache plugin installed and configured
  • The route fetches data using the @pantheon-systems/wordpress-kit Graphql client or requests to WordPress are made using the GET method and include the Pantheon-SKey: 1 header
    • in order to see the headers, you must use the client.rawRequest() method.
  • The headers must be added to the outgoing response from Next.js in getServerSideProps (see context.res).