Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fetch options are overridden on parallel requests #531

Open
1 task done
vakrilov opened this issue Jul 31, 2024 · 1 comment
Open
1 task done

Fetch options are overridden on parallel requests #531

vakrilov opened this issue Jul 31, 2024 · 1 comment
Labels
pending-author [Issue] Awaiting further information or action from the issue author pending-triage [Issue] Ticket is pending to be prioritised

Comments

@vakrilov
Copy link

Describe the issue you're facing

On multiple parallel requests to the API are made (so that the client throttling is triggered) the the fetch params are not passed correctly to the fetch function.

Looks like the reason this happens is that fetchOptions are preserved in the SbFetch instance and then used when calling fetch.

Reproduction

https://stackblitz.com/edit/stackblitz-starters-xkyznv?file=index.js

Steps to reproduce

Here is a short example using node. I've added a custom fetch wrapper to observe the passed parameters:

import { storyblokInit, apiPlugin } from "@storyblok/js";

const { storyblokApi } = storyblokInit({
  accessToken: "XXXXXXX",
  use: [apiPlugin],
  apiOptions: {
    rateLimit: 2, // reduced to 2 for simplicity
    fetch: (url, params) => {
      console.log(`Fetch params.next.tag: ${params?.next?.tags}`);
      return fetch(url, params);
    },
  },
});

const slugs = ["slug1", "slug2", "slug3", "slug4", "slug5"];

await Promise.allSettled(
  slugs.map((slug) =>
    storyblokApi.get(`cdn/stories/${slug}`, {}, { next: { tags: [slug] } })
  )
);

Output (after rateLimit is triggered all subsequent fetch calls have the params of the last get) :

Fetch params.next.tag: slug1
Fetch params.next.tag: slug2
Fetch params.next.tag: slug5
Fetch params.next.tag: slug5
Fetch params.next.tag: slug5

Expected Output:

Fetch params.next.tag: slug1
Fetch params.next.tag: slug2
Fetch params.next.tag: slug3
Fetch params.next.tag: slug4
Fetch params.next.tag: slug5

System Info

System:
    OS: macOS 14.5
    CPU: (10) arm64 Apple M1 Max
    Memory: 3.22 GB / 64.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.19.1 - ~/.asdf/installs/nodejs/18.19.1/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.2.4 - ~/.asdf/plugins/nodejs/shims/npm
    pnpm: 9.4.0 - /usr/local/bin/pnpm
  Browsers:
    Chrome: 127.0.6533.88
    Safari: 17.5

Used Package Manager

npm

Error logs (Optional)

No response

Validations

@vakrilov vakrilov added pending-author [Issue] Awaiting further information or action from the issue author pending-triage [Issue] Ticket is pending to be prioritised labels Jul 31, 2024
@vakrilov
Copy link
Author

To add more context, I'm using the fetchOptions to configure revalidation tags in a NextJS application.
With this issue - when statically building the application there are multiple requests to the Storyblok API, however they all end up with the same tag instead of different ones.

The workaround for now is to create a new client (with storyblokInit) for each request so that it has separate SbFetch instance and separate fetchOptions.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
pending-author [Issue] Awaiting further information or action from the issue author pending-triage [Issue] Ticket is pending to be prioritised
Projects
None yet
Development

No branches or pull requests

1 participant