Caching issue Ghost CMS

[marcoSven]

Content changes (updating, adding, or deleting), don't show after the first webhook triggered deploy. The changes usually show on the next or following build. Thoughts?

netlify.toml

`[build] command = "GATSBY_EXPERIMENTAL_PAGE_BUILD_ON_DATA_CHANGES=true gatsby build --log-pages" publish = "demo/public"

[template] incoming-hooks = ["Ghost"]

[[plugins]] package = "netlify-plugin-gatsby-cache"`

[jlengstorf]

it's hard to know what's causing the issue without more information. if there are service workers in use, they can affect this; I have no idea how the Ghost plugin pulls in data or what's actually missing in the build

if you can share the build log and/or the repo, I can take a look and see if we can spot the issue

thanks!

[marcoSven]

Hi, here are two starter builds both have the same caching issue. Notice dazzling matches the content (/test-post/ - Saucer sugar lemon decaffeinated) of the source, this is because there was one additional deploy after the content change build hook. Here link I see Saucer sour sugar lemon decaffeinated

1. https://github.com/marcoSven/gatsby-starter-ghost - https://dazzling-bassi-c3e77e.netlify.app/test-post/
2. https://github.com/marcoSven/gatsby-starter-try-ghost - https://lucid-bartik-860c1d.netlify.app/

CMS https://ghostwriterdev.bettinalimaco.com/test-post/ - both sites are triggered by content changes via build hooks

Sample log

7:22:06 AM: Build ready to start 7:22:07 AM: build-image version: b0258b965567defc4a2d7e2f2dec2e00c8f73ad6 7:22:07 AM: build-image tag: v3.4.1 7:22:07 AM: buildbot version: cdc66b02d86506251d3343610a77385376c8c035 7:22:07 AM: Fetching cached dependencies 7:22:07 AM: Starting to download cache of 202.1MB 7:22:08 AM: Finished downloading cache in 1.090560036s 7:22:08 AM: Starting to extract cache 7:22:15 AM: Finished extracting cache in 6.72023412s 7:22:15 AM: Finished fetching cache in 7.85151605s 7:22:15 AM: Starting to prepare the repo for build 7:22:15 AM: Preparing Git Reference refs/heads/master 7:22:17 AM: Different publish path detected, going to use the one specified in the Netlify configuration file: 'public' versus 'public/' in the Netlify UI 7:22:17 AM: Starting build script 7:22:17 AM: Installing dependencies 7:22:17 AM: Python version set to 2.7 7:22:17 AM: Started restoring cached node version 7:22:20 AM: Finished restoring cached node version 7:22:20 AM: Attempting node version '12' from .nvmrc 7:22:21 AM: v12.19.0 is already installed. 7:22:21 AM: Now using node v12.19.0 (npm v6.14.8) 7:22:21 AM: Started restoring cached build plugins 7:22:21 AM: Finished restoring cached build plugins 7:22:21 AM: Attempting ruby version 2.7.1, read from environment 7:22:22 AM: Using ruby version 2.7.1 7:22:23 AM: Using PHP version 5.6 7:22:23 AM: 5.2 is already installed. 7:22:23 AM: Using Swift version 5.2 7:22:23 AM: Started restoring cached node modules 7:22:23 AM: Finished restoring cached node modules 7:22:23 AM: Started restoring cached yarn cache 7:22:23 AM: Finished restoring cached yarn cache 7:22:23 AM: Installing NPM modules using Yarn version 1.22.4 7:22:24 AM: yarn install v1.22.4 7:22:24 AM: [1/5] Validating package.json... 7:22:24 AM: [2/5] Resolving packages... 7:22:24 AM: warning Resolution field "sharp@0.26.0" is incompatible with requested version "sharp@^0.25.4" 7:22:24 AM: warning Resolution field "sharp@0.26.0" is incompatible with requested version "sharp@^0.25.4" 7:22:24 AM: warning Resolution field "sharp@0.26.0" is incompatible with requested version "sharp@^0.25.4" 7:22:25 AM: success Already up-to-date. 7:22:25 AM: Done in 0.94s. 7:22:25 AM: NPM modules installed using Yarn 7:22:25 AM: Started restoring cached go cache 7:22:25 AM: Finished restoring cached go cache 7:22:25 AM: go version go1.14.4 linux/amd64 7:22:25 AM: go version go1.14.4 linux/amd64 7:22:25 AM: Installing missing commands 7:22:25 AM: Verify run directory 7:22:26 AM: ​ 7:22:26 AM: ┌─────────────────────────────┐ 7:22:26 AM: │ Netlify Build │ 7:22:26 AM: └─────────────────────────────┘ 7:22:26 AM: ​ 7:22:26 AM: ❯ Version 7:22:26 AM: @netlify/build 5.0.3 7:22:26 AM: ​ 7:22:26 AM: ❯ Flags 7:22:26 AM: deployId: 5f96db8eae032f2391a1e625 7:22:26 AM: mode: buildbot 7:22:26 AM: ​ 7:22:26 AM: ❯ Current directory 7:22:26 AM: /opt/build/repo 7:22:26 AM: ​ 7:22:26 AM: ❯ Config file 7:22:26 AM: /opt/build/repo/netlify.toml 7:22:26 AM: ​ 7:22:26 AM: ❯ Context 7:22:26 AM: production 7:22:26 AM: ​ 7:22:26 AM: ❯ Loading plugins 7:22:26 AM: - netlify-plugin-gatsby-cache@0.3.0 from netlify.toml 7:22:26 AM: ​ 7:22:26 AM: ┌────────────────────────────────────────────────────────┐ 7:22:26 AM: │ 1. onPreBuild command from netlify-plugin-gatsby-cache │ 7:22:26 AM: └────────────────────────────────────────────────────────┘ 7:22:26 AM: ​ 7:22:27 AM: Found a Gatsby cache. We’re about to go FAST. ⚡️ 7:22:27 AM: ​ 7:22:27 AM: (netlify-plugin-gatsby-cache onPreBuild completed in 554ms) 7:22:27 AM: ​ 7:22:27 AM: ┌────────────────────────────────────┐ 7:22:27 AM: │ 2. build.command from netlify.toml │ 7:22:27 AM: └────────────────────────────────────┘ 7:22:27 AM: ​ 7:22:27 AM: $ NODE_ENV=production gatsby build 7:22:29 AM: success open and validate gatsby-configs - 0.106s 7:22:30 AM: success load plugins - 0.846s 7:22:30 AM: success onPreInit - 0.098s 7:22:30 AM: success delete html and css files from previous builds - 0.008s 7:22:30 AM: success initialize cache - 0.005s 7:22:30 AM: success copy gatsby files - 0.037s 7:22:30 AM: warning gatsby-plugin-feed was initialized in gatsby-config.js without a title in a feed. 7:22:30 AM: This means that the plugin will use the default feed title, which may not match your use case. 7:22:30 AM: This behavior will be removed in the next major release of gatsby-plugin-feed. 7:22:30 AM: For more info, check out: https://gatsby.dev/adding-rss-feed 7:22:30 AM: success onPreBootstrap - 0.020s 7:22:30 AM: success createSchemaCustomization - 0.030s 7:22:31 AM: success Checking for changed pages - 0.000s 7:22:31 AM: success source and transform nodes - 0.529s 7:22:32 AM: success building schema - 0.533s 7:22:32 AM: info Total nodes: 71, SitePage nodes: 14 (use --verbose for breakdown) 7:22:32 AM: success createPages - 0.067s 7:22:32 AM: success Checking for changed pages - 0.000s 7:22:32 AM: success createPagesStatefully - 0.066s 7:22:32 AM: success Cleaning up stale page-data - 0.002s 7:22:32 AM: success update schema - 0.030s 7:22:32 AM: success onPreExtractQueries - 0.001s 7:22:32 AM: success extract queries from components - 0.580s 7:22:32 AM: warning The GraphQL query in the non-page component "/opt/build/repo/src/templates/page.js" will not be run. 7:22:32 AM: Exported queries are only executed for Page components. It's possible you're 7:22:32 AM: trying to create pages in your gatsby-node.js and that's failing for some reason. 7:22:32 AM: If the failing component(s) is a regular component and not intended to be a page 7:22:32 AM: component, you generally want to use a (https://gatsbyjs.org/docs/static-query) 7:22:32 AM: instead of exporting a page query. 7:22:32 AM: If you're more experienced with GraphQL, you can also export GraphQL fragments from components and compose the fragments in the Page component 7:22:32 AM: query and pass data down into the child component — https://graphql.org/learn/queries/#fragments 7:22:32 AM: success write out redirect data - 0.001s 7:22:32 AM: success onPostBootstrap - 0.000s 7:22:32 AM: info bootstrap finished - 5.502s 7:22:32 AM: success run page queries - 0.138s - 8/8 57.80/s 7:22:32 AM: success write out requires - 0.004s 7:22:37 AM: success Building production JavaScript and CSS bundles - 5.022s 7:22:39 AM: success Building static HTML for pages - 1.579s - 15/15 9.50/s 7:22:40 AM: info Generated public/sw.js, which will precache 7 files, totaling 276956 bytes. 7:22:40 AM: The following pages will be precached: 7:22:40 AM: /offline-plugin-app-shell-fallback/index.html 7:22:40 AM: success onPostBuild - 0.466s 7:22:40 AM: info Done building in 13.133904761 sec 7:22:40 AM: ​ 7:22:40 AM: (build.command completed in 13.3s) 7:22:40 AM: ​ 7:22:40 AM: ┌─────────────────────────────────────────────────────────┐ 7:22:40 AM: │ 3. onPostBuild command from netlify-plugin-gatsby-cache │ 7:22:40 AM: └─────────────────────────────────────────────────────────┘ 7:22:40 AM: ​ 7:22:40 AM: Stored the Gatsby cache to speed up future builds. 7:22:40 AM: ​ 7:22:40 AM: (netlify-plugin-gatsby-cache onPostBuild completed in 378ms) 7:22:41 AM: ​ 7:22:41 AM: ┌─────────────────────────────┐ 7:22:41 AM: │ Netlify Build Complete │ 7:22:41 AM: └─────────────────────────────┘ 7:22:41 AM: ​ 7:22:41 AM: (Netlify Build completed in 14.6s) 7:22:41 AM: Caching artifacts 7:22:41 AM: Started saving node modules 7:22:41 AM: Finished saving node modules 7:22:41 AM: Started saving build plugins 7:22:41 AM: Finished saving build plugins 7:22:41 AM: Started saving yarn cache 7:22:41 AM: Finished saving yarn cache 7:22:41 AM: Started saving pip cache 7:22:41 AM: Finished saving pip cache 7:22:41 AM: Started saving emacs cask dependencies 7:22:41 AM: Finished saving emacs cask dependencies 7:22:41 AM: Started saving maven dependencies 7:22:41 AM: Finished saving maven dependencies 7:22:41 AM: Started saving boot dependencies 7:22:41 AM: Finished saving boot dependencies 7:22:41 AM: Started saving go dependencies 7:22:41 AM: Finished saving go dependencies 7:22:41 AM: Build script success 7:22:41 AM: Starting to deploy site from 'public' 7:22:41 AM: Creating deploy tree 7:22:41 AM: Creating deploy upload records 7:22:41 AM: 12 new files to upload 7:22:41 AM: 0 new functions to upload 7:22:42 AM: Starting post processing 7:22:42 AM: Post processing - HTML 7:22:42 AM: Post processing - header rules 7:22:42 AM: Post processing - redirect rules 7:22:43 AM: Post processing done 7:22:43 AM: Site is live ✨ 7:23:14 AM: Finished processing build request in 1m6.379701269s

[jlengstorf]

thanks for your patience! I just checked these sites and there are Service Workers running — this will keep older content cached locally, which means the deployed site may be different than the cached site in your browser. this is a known issue with Service Workers, and the Gatsby Cache plugin won't affect this behavior

however, you can verify this by checking the "bypass for network" box in Chrome DevTools > Applications > Service Workers:

I hope that helps!

[marcoSven]

https://lucid-bartik-860c1d.netlify.app/ - there is no service worker on this site, which is the site with one content change behind. https://dazzling-bassi-c3e77e.netlify.app/test-post/ - this one with sw is the one that shows the latest content.

Notice dazzling matches the content (/test-post/ - Saucer sugar lemon decaffeinated) of the source, this is because there was one additional deploy after the content change build hook.

[jlengstorf]

ah, hmm. let me tag @ehmicky on this, because we'll need to dig into these sites to figure out what's going on

[erquhart]

@marcoSven can you try with the Gatsby cache plugin disabled, and if it is still occurring, with experimental builds disabled?

[marcoSven]

@erquhart when I remove netlify-plugin-gatsby-cache the issue is no longer occurring. This demo installation is currently not running but I tested it previously multiple times.