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

JavaScript Vue.js

蛋蛋

2020-03-23

如何使用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')
  })
}

但是，当然没有任何效果。

第3140篇《如何将Naver Analytics添加到Nuxt.js SPA应用程序？》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共1个回答
伽罗 2020.03.23

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

  • If you are using the default template by nuxt, there should be a file app.template.html (inside .nuxt/views/). Inside that you can update the above text just before </body> tag.
  • If you have overriden it and created your own, it should be by the name of app.html (at the same level as nuxt.config.js)

The structure of that file is something below. You can add the tags in between {{ APP }} and </body> tag

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

Hope it helps. Revert for any doubts.

相似问题

0 回答

0 回答

5 回答

25 回答

0 回答

0 回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android