仅在某些页面上使用 setPostBodyComponents 在 Gatsby 上添加脚本

Question

是否可以只在某些页面而不是所有页面中呈现插入到 body 标记中的脚本（使用 setPostBodyComponents）？

有什么想法可以实现吗？

Answer 1

正如您在 gatsby-ssr-js docs 中看到的那样，onRenderBody 暴露了一堆 props，其中有一个 pathname。

pathname {string}

The pathname of the page currently being rendered.

也就是说，您可以尝试类似的操作：

const React = require("react")

exports.onRenderBody = ({ setPostBodyComponents, pathname }) => {
   const SCRIPT_PAGES = ['/page-1', '/page-2'];

   if(SCRIPT_PAGES.includes(pathname)){
      setPostBodyComponents([
        <script dangerouslySetInnerHTML={{ __html:`your script here`}} />,
    ]);
  }
};

在这种情况下，您的 SCRIPT_PAGES 将保留要插入脚本的页面。使用这种方法，您可以根据需要进行调整。

仅在某些页面上使用 setPostBodyComponents 在 Gatsby 上添加脚本

adding a script on Gatsby with setPostBodyComponents only on certain pages

javascript

reactjs

gatsby