google-chrome-extension - 如何让 gtag 在 chrome 扩展中工作?

标签 google-chrome-extension google-analytics analytics gtag.js

我已将 gtag.js 添加到我的 Chrome 扩展程序中,但我在网络上看不到任何内容,请告诉我我做错了什么。

这是我在manifest.json 中的CSP

{
   "content_security_policy": "script-src 'self' https://www.googletagmanager.com https://ssl.google-analytics.com https://www.google-analytics.com https://mustsee-earth.firebaseio.com; object-src 'self'"
}

这是我的扩展程序使用的index.html(替换用户的默认选项卡)

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>mustsee.earth</title>
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX-X"></script>
</head>

这是我触发 View 和事件的方法

gtag('config', GATID, {
  page_title: place.name,
  page_path: path
})

gtag('event', binding_value.action, {
    event_category: binding_value.category,
    event_label: binding_value.label,
    value: binding_value.value
})

尽管我遵循了每一步,但网络上有以下内容:什么也没有。

这是 dataLayer var,它证明我的事件已添加到队列中但未触发

[
 {
  "0": "js",
  "1": "2018-04-24T21:02:54.881Z"
 },
 {
  "0": "config",
  "1": "UA-XXXXXXXXX-X",
  "2": {
   "checkProtocolTask": null,
   "custom_map": {
    "dimension5": "under 1.5 or failed"
   }
  }
 },
 {
  "0": "config",
  "1": "UA-XXXXXXXXX-X",
  "2": {
   "page_title": "Mesquite Flat Sand Dunes",
   "page_path": "/mesquite-flat-oleksandr-mokrohuz-small.jpg"
  }
 },
 {
  "0": "event",
  "1": "click on reload",
  "2": {
   "event_category": "Image View"
  }
 }
]

这里可能出现什么问题?

最佳答案

在 Chrome 扩展中添加 gtm 是一项有点棘手的工作。我曾经遇到过你现在面临的同样的问题。不过,在 CE 中实现 gtm 是可能的。

您的 list 看起来不错。您需要在 https://tagmanager.google.com/ 中进行一些配置更改

您必须向每个 gtm 标记添加 checkProtocolTask​​ : false 才能从 Google Chrome 扩展程序跟踪它们。

checkProtocolTask​​ : false 添加到要设置的字段

向下滚动到要设置的字段,然后添加新字段:

Field Name: checkProtocolTask
Value: false

参见this SO post更多细节。

关于google-chrome-extension - 如何让 gtag 在 chrome 扩展中工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50010945/

相关文章:

javascript - 每当请求资源时运行 Chrome 内容脚本

javascript - gtag 不发送事件的自定义维度

azure - 对 Azure 静态 Web 应用进行更深入的分析?

javascript - 点击事件在 Chrome 扩展程序的后台页面中不起作用

javascript - 使用 Whatsapp API 进行 Chrome 扩展程序开发

pandas - 使用 Pandas 替代 Google Analytics IO

javascript - 测试站点+实时站点分析

jquery - 如何使用 jQuery 非选择器来选择相对 URL?

php - 如何使用 php 和 jquery 跟踪访问者,从综合浏览量中确定唯一访问者

google-chrome-extension - 如何在不使依赖代码成为模块的情况下导入 TypeScript AMD 模块