如何将Naver Analytics添加到Nuxt.js SPA应用程序?

问题描述 投票:2回答:1

如何通过SSR在nuxt.js(Vue.js)中向网站添加跟踪代码?

Naver Analytics跟踪代码示例:

<script type="text/javascript" src="//wcs.naver.net/wcslog.js"></script>
<script type="text/javascript">
if(!wcs_add) var wcs_add = {};
wcs_add["wa"] = "123456789abcd";
wcs_do();
</script>

我已经尝试过:nuxt.config.js

script: [{ src: '//wcs.naver.net/wcslog.js' }]
...
{src: '~plugins/naver-analytics.js', ssr: false}

plugins / naver-analytics.js

export default ({ app }) => {
  if(!wcs_add) var wcs_add = {};
  wcs_add["wa"] = "123456789";
  wcs_do();
  wcs.event('create', '123456789', 'auto')
  app.router.afterEach((to, from) => {
    wcs.event('set', 'page', to.fullPath)
    wcs.event('send', 'pageview')
  })
}

但是,当然没有任何作用。

javascript analytics single-page-application nuxt.js server-side-rendering
1个回答
0
投票

通常将这些脚本添加到所有页面的公共位置(在根目录)。

  • 如果您通过nuxt使用默认模板,则应该在app.template.html内部有一个文件.nuxt/views/。在其中,您可以在</body>标签之前更新上述文本。
  • 如果您已覆盖它并创建了自己的名称,则其名称应为app.html(与nuxt.config.js处于同一级别)

该文件的结构如下。您可以在{{ APP }}</body>标签之间添加标签

<!DOCTYPE html>
<html {{ HTML_ATTRS }}>
  <head {{ HEAD_ATTRS }}>
    {{ HEAD }}
  </head>
  <body {{ BODY_ATTRS }}>
    {{ APP }}
  </body>
</html>

希望有帮助。如有任何疑问,请回复。

© www.soinside.com 2019 - 2024. All rights reserved.