首页 > 解决方案 > Gatsby + Hotjar:Hotjar-Id 和 Hotjar-Snippet 版本的环境变量?

问题描述

这里它说我需要像这样设置 hotjar,如果我想将它与 gatsby 一起使用:

// In your gatsby-config.js
plugins: [
  {
    resolve: `gatsby-plugin-hotjar`,
    options: {
      id: YOUR_HOTJAR_ID,
      sv: YOUR_HOTJAR_SNIPPET_VERSION
    },
  },
]

我现在的新手问题是:我可以直接在其中粘贴 id / snippet 版本吗?还是我必须担心安全问题并且应该考虑环境变量等?

标签: javascriptreactjsgatsbyhotjar

解决方案


您可以直接将它们粘贴在那里。

Hotjar 说明提到将此代码段添加到每个页面的顶部

<script>
    (function(h,o,t,j,a,r){
        h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
        h._hjSettings={hjid:99999999999999,hjsv:00000000000000};
//                          ^^^^^^^^^^^^^^      ^^^^^^^^^^^^^^
//                          SITE ID             SNIPPET VERSION

        a=o.getElementsByTagName('head')[0];
        r=o.createElement('script');r.async=1;
        r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
        a.appendChild(r);
    })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
</script>

这个插件在这里做同样的事情:https ://github.com/pavloko/gatsby-plugin-hotjar/blob/d30edfe1bf56b98feb819310d3a16d3d30118793/src/gatsby-ssr.js#L13

任何查看您网站来源的人都可以查看这两种实施方式。


推荐阅读