Use waitUntil to perform work after Cloudflare Worker returns response

InstructorJon Meyers

Share this video with your friends

Send Tweet

The waitUntil function allows us to continue performing work in our Cloudflare Worker, after a response has been sent back to the client.

In this lesson, we modify the revalidate route to send a response immediately, and then continue on to fetch new data and refresh our KV store.

Finally, we use the Thunder Client extension to simulate a POST request to the revalidate route, and confirm that this receives a response before the cache is updated.

Code Snippets

Update Revalidate route to respond immediately

router.post(
  "/revalidate",
  withContent,
  async (request, { SUPABASE_URL, SUPABASE_ANON_KEY, ARTICLES }, context) => {
    const updateCache = async () => {
      const { type, record, old_record } = request.content;
      const supabase = createClient(SUPABASE_URL, SUPABASE_ANON_KEY);

      if (type === "INSERT" || type === "UPDATE") {
        await writeTo(ARTICLES, `/articles/${record.id}`, record);
      }

      if (type === "DELETE") {
        await ARTICLES.delete(`/articles/${old_record.id}`);
      }

      const { data: articles } = await supabase.from("articles").select("*");
      await writeTo(ARTICLES, "/articles", articles);
      console.log("updated cache");
    };

    context.waitUntil(updateCache());

    console.log("sending response");

    return json({ received: true });
  }
);

Run wrangler development server

npx wrangler dev

Resources