javascript - 如何将 Naver Analytics 添加到 Nuxt.js SPA 应用程序?
问题描述
如何使用 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}
插件/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')
})
}
但是,当然,没有任何效果。
解决方案
这些脚本通常添加到所有页面的公共位置(根目录)。
- 如果您使用 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>
希望能帮助到你。如有任何疑问,请回复。
推荐阅读
- ios - 为什么在 iOS WKWebView 上不能下载一些图片
- c# - 如何在 where 条件下使用其他属性值更新 Azure 存储表一个特定属性值?
- mongodb - Mongoose 填充数组并返回所有文档(即使未找到填充)
- twitter-bootstrap - div在引导程序中使用而不是表
- python - 如何使用 python 和 Flask 在网页上显示和编辑文本文件?
- android - 显示警报 requestPermissions close Activity 时出现问题
- reactjs - React Hooks - 无效的 Hook 调用
- google-play - 我的应用处于生产状态,但是当我点击“在 Google Play 上查看”时,它显示错误
- vba - 使用子参数访问 VBA 更新表单文本框
- mongodb - MongoDb 在仅使用聚合过滤输出时需要帮助