Hydration error：opening previewURL for localhost:3000

General
,
1

next:14.2.3
sdk-react:1.0.26

next-page router(getServerSideProps)

fetchOneEntry({
      model: 'page',
      apiKey,
      locale: lang,
      userAttributes: { urlPath, version: Date.now() },
})

export default function App(props: Readonly<Props>) {
  const { page } = props
  const shouldRenderBuilderContent = page || isPreviewing() || isEditing()

  return shouldRenderBuilderContent ? (
    <Content customComponents={CUSTOM_COMPONENTS} content={page} model="page" apiKey={apiKey} />
  ) : (
    <DefaultErrorPage statusCode={404} />
  )
}

When accessing localhost:3000 through the PreviewURL, encountering a hydration error that doesn’t occur when the site is accessed normally. The issue is likely due to parameters in the URL that may be causing <script> or <style> to be nested within <div> elements during rendering. How can this be resolved?

2

Hello @RadisLuo ,

For resolving hydration-related issues, we recommend you check out the below blog and plugin

Hope this helps!