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
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 thePantheon-SKey: 1
header- in order to see the headers, you must use the
client.rawRequest()
method.
- in order to see the headers, you must use the
- The headers must be added to the outgoing response from Next.js in
getServerSideProps
(seecontext.res
).- The
next-wordpress-starter
includes a helper function that combines headers from multiple requests and adds them to the outgoing response.
- The