next.js - NextJs 脚本未在组件内渲染

Question

我正在尝试在我的 NextJs 网站上实现 Cookiebot。 文档( Link to docs )提到在特定页面的 HTML 中插入 cookie 声明的脚本，对我来说，它是一个仅用于 cookie 声明的自己的子页面。 如果我使用文档中提到的 HTML 元素 <script .../>，当我切换到页面时，文本不会加载，但只有在进入页面后刷新后才会加载。 如果我使用 NextJs 脚本组件 Link to docs通过将 <script ..> 切换到 next/script 并从 next/script 导入它，cookie 声明会按预期立即加载，但它被放置在页面其他所有内容的下方，甚至在页脚下方(即使我将页面包装在布局内)带页脚)。 我的布局代码如下所示: `

function BasePage(props: IBasePageProps) {
  return (
    <div>
      <Navbar />
      <main>{props.children}</main>
      <Footer />
    </div>
  );
}

This works for every page and everything - the pages are all between the Navbar and Footer. However if I use following code for the page of the screenshot, the <Script .../> text is loaded below the footer.

export default function CookieRichtlinie() {

  return (
    <>
            <h1 className="pb-8 mt-2 text-3xl font-extrabold leading-8 tracking-tight text-gray-900 sm:text-4xl">
              Cookie Richtlinie
            </h1>
            <div id="CookiePolicyText">
              <Script
                id="CookieDeclaration"
src="https://consent.cookiebot.com/12345/cd.js"
                type="text/javascript"
                async
              />
            </div>
    </>
  );

`

经过两天的谷歌搜索，我找不到任何与此问题接近的问题或线程。有人经历过这个或者知道我可以尝试什么？

<Script ...> below everything else

将 next/script 的