Issue: Storyblok API sometimes returns unhandled runtime error when fetching page data.
Expectation: Storyblok API fetches data perfectly everytime.
Tech stack: Next 14, Storyblok, Tailwind
Docs used: https://www.storyblok.com/tp/add-a-headless-cms-to-next-js-13-in-5-minutes
Github : https://github.com/BryanMF87/bokeria
Online : https://bokeria.vercel.app/en
Details : I use the StoryBlokBridgeLoader on my root layout file for server-only data fetching
import { storyblokInit, apiPlugin } from "@storyblok/react/rsc";
import StoryblokBridgeLoader from '@storyblok/react/bridge-loader';
storyblokInit({
accessToken: process.env.SB_TOKEN,
use: [apiPlugin],
});
return (
<html>
<body>
{children}
</body>
<StoryblokBridgeLoader options={{}} />
</html>
);
Details: Each page I import and call the getStoryblokApi before data fetching
import { getStoryblokApi } from '@storyblok/react';
export default async function Home() {
const storyblokApi = getStoryblokApi();
const data = await storyblokApi.get(`cdn/stories/pages/home-page`, {
version: "draft",
language: lang,
});
const content = data.data.story.content;
Details : About 50% of the time when I try to link to another page I get this
Uncaught TypeError: Cannot read properties of null (reading 'get')