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

时间:2018-04-24 21:27:09

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

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

这是我在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>

以下是我触发视图和事件的方法

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"
  }
 }
]

这里的问题是什么?

1 个答案:

答案 0 :(得分:2)

在Chrome扩展程序中添加gtm是一项有点棘手的工作。我遇到了你现在面临的同样问题。但是,这可以在CE中实现gtm。

你的清单看起来很好。您需要在https://tagmanager.google.com/

中进行一些配置更改

您必须为每个gtm标记添加checkProtocolTask : false,以便从Google Chrome扩展程序中跟踪它们。

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

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

Field Name: checkProtocolTask
Value: false

有关详细信息,请参阅this SO post