`published` version is infinitely cached in `SSR` or `dev` environments

[codeflorist]

Describe the issue you're facing

Problems with API requests for published stories delivering stale content have been reported for quite a while. An example would be #55. They also get reported every several weeks in the Discord - not only regarding Nuxt SDK, but e.g. also by nextjs users.

It is reproducable with Storyblok's official Quickstart Demo Stackblitz (https://stackblitz.com/edit/nuxt-3-quickstart-demo). Using version: 'draft', everything works fine, but if it is changed to published, no backend changes will be reflected on reload. This is in dev and SSR build environments.

I believe the culprit lies with storyblok-js-client, specifically this if-statement: https://github.com/storyblok/storyblok-js-client/blob/3592e384637659112d710fe59fe216130dab0350/src/index.ts#L632

          if (
            params.version === 'draft' &&
            cacheVersions[params.token] != response.data.cv
          ) {
            await this.flushCache()
          }

I believe this means, a cache-flush is only performed, if draft versions are requested. Otherwise i guess the response will stay in memory-cache forever.

I don't know the purpose of limiting the flush-behaviour to draft requests. If it is unwanted ot a bug, imho it should be removed.

Also notable: On the page https://www.storyblok.com/tp/optimize-your-caching-strategy-with-storyblok it is stated, that with any SDK using storyblok-js-client cache invalidation should be taken care of automatically, which seems to be the case for draft, but not published requests.

Reproduction

https://stackblitz.com/edit/nuxt-3-quickstart-demo

Steps to reproduce

1. change version: 'draft' to version: 'published' in index.vue.
2. create a new demo-space and set the Real Path of home to / (as described in the tutorial)
3. change a text in the editor and publish it.
4. reload the stackblitz-window. the stale content will remain, which is not happening, with version: 'draft'.

System Info

------------------------------
- Operating System: Linux
- Node Version:     v18.20.3
- Nuxt Version:     3.10.2
- CLI Version:      3.10.0
- Nitro Version:    2.8.1
- Package Manager:  npm@10.2.3
- Builder:          -
- User Config:      css, modules
- Runtime Modules:  @storyblok/nuxt@6.0.4, @nuxtjs/tailwindcss@6.11.4
- Build Modules:    -
------------------------------

Used Package Manager

npm

Error logs (Optional)

No response

Validations

• [X] Follow our Code of Conduct

[codeflorist]

I see, there is already an upsteam-issue regarding this. I also commented there: https://github.com/storyblok/storyblok-js-client/issues/823

[awacode21]

I have been annoyed with this problem for more than half a year. I think this should really be fixed. Currently you always have to perform a new deployment/server restart to make the published changes visible on the server side.

Thank you @codeflorist for analyzing so deeply to identify this problem.

[alvarosabu]

Hi @codeflorist we just merged https://github.com/storyblok/storyblok-js-client/pull/847, this potentially solves this issue, could you test it when the nuxt module version bump is propagated?

[codeflorist]

Hey @alvarosabu, this looks good now. 👍 Many thanks and have a nice day!