使用 amp-pixel 还是 amp-analytics？
创建一个简单的分析配置
- 简单的 amp-pixel 配置
- 简单的 amp-analytics 配置
AMP Story 默认配置
变量替换
用户身份识别

分析：基础知识

从这里开始了解有关 AMP 分析的基础知识。

使用 amp-pixel 还是 amp-analytics？

AMP 提供了两个组件来满足您的分析和测量需求：amp-pixel 和 amp-analytics。这两个选项都会将分析数据发送到定义的端点。

如果您正在寻找类似简单的跟踪像素的行为，则 amp-pixel 组件提供基本的页面浏览跟踪；页面浏览数据会被发送到定义的 URL。与某些供应商的集成可能会要求使用此组件，在这种情况下，他们会指定确切的 URL 端点。

对于大多数分析解决方案，请使用 amp-analytics。页面浏览跟踪在 amp-analytics 中也有效。但是，您还可以跟踪用户与任何类型页面内容的互动，包括点击链接和按钮。

您还可以衡量用户在故事中点击了多远，以及用户是否与交互元素进行了互动。

请参阅深入了解 AMP 分析。

作为与 AMP 平台集成的一部分，提供商提供了预定义的 amp-analytics 配置，以便轻松捕获数据并推送到他们的跟踪工具。从分析供应商列表中访问供应商文档。

您可以在页面中使用 amp-pixel 和 amp-analytics：amp-pixel 用于简单的页面浏览跟踪，amp-analytics 用于其他所有内容。您还可以添加每个标签的多个副本。如果您与多个分析提供商合作，则每个解决方案需要一个标签。请记住，更简单的 AMP 页面对用户更好，因此，如果您不需要额外的标签，请不要使用它们。

创建一个简单的分析配置

了解如何创建简单的 amp-pixel 和 amp-analytics 配置。

简单的 `amp-pixel` 配置

要创建简单的 amp-pixel 配置，请将类似以下内容插入到您的 AMP 页面的正文中

<amp-pixel src="https://foo.com/pixel?RANDOM"></amp-pixel>

在此示例中，页面浏览数据会与随机数一起发送到定义的 URL。RANDOM 变量是 AMP 平台中的许多替换变量之一。在此处了解有关变量替换的更多信息。

amp-pixel 组件是内置的，因此您不需要像 AMP 的扩展组件（包括 amp-analytics）那样添加包含声明。但是您应该将 amp-pixel 标签尽可能靠近 <body> 的开头位置。跟踪像素仅在标签本身进入视图时才会触发。如果 amp-pixel 位于页面的底部附近，则可能不会触发。

简单的 `amp-analytics` 配置

要创建简单的 amp-analytics 配置，您必须首先在 AMP 文档的 <head> 中包含此 custom-element 声明（另请参阅组件包含声明）

<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

以下示例与 amp-pixel 示例类似。每次页面可见时，都会触发触发事件，并将页面浏览数据与随机 ID 一起发送到定义的 URL

<amp-analytics>
<script type="application/json">
  {
    "requests": {
      "pageview": "https://foo.com/pixel?RANDOM"
    },
    "triggers": {
      "trackPageview": {
        "on": "visible",
        "request": "pageview"
      }
    }
  }
</script>
</amp-analytics>

在上面的示例中，我们定义了一个名为 pageview 的请求，其值为 https://foo.com/pixel?RANDOM。如前所述，RANDOM 会被一个随机数替换，因此请求最终看起来像 https://foo.com/pixel?0.23479283687235653498734。

当页面变为可见时（如触发关键字 visible 所指定），会触发一个事件并发送 pageview 请求。触发器属性确定何时触发 pageview 请求。了解有关请求和触发器的更多信息。

AMP Story 默认配置

网站的典型用户旅程与故事截然不同。在网站上，用户可能会阅读标题，滚动到页面底部，与表单交互，然后点击链接到下一页。故事占据整个视口，用户不滚动，而是点击以向前移动。

许多人希望将故事中的每个新的 <amp-story-page> 视为一个新的页面浏览量，因为从一个屏幕到另一个屏幕的内容差异很大。但是，页面只是整个故事中的一个元素，用户通常需要查看许多故事页面才能对故事有完整的了解。因此，我们如何计算像页面浏览量这样简单的事情对我们的分析方法具有巨大的影响。

AMP Analytics 可以使用任何分析供应商轻松实现上述目标。例如，对于 Google Analytics 的全局站点标签，如下面的代码段所示。

<amp-analytics type="gtag" data-credentials="include">
 <script type="application/json">
  {
    "vars": {
      "gtag_id":"YOUR_GOOGLE_ANALYTICS_ID",
      "config": {
        "YOUR_GOOGLE_ANALYTICS_ID": {
          "groups":"default"
        }
      }
    },
    "triggers": {
      "storyProgress": {
        "on":"story-page-visible",
        "vars": {
          "event_name":"custom",
          "event_action":"story_progress",
          "event_category":"${title}",
          "event_label":"${storyPageId}",
          "send_to": [
            "YOUR_GOOGLE_ANALYTICS_ID"
          ]
        }
      },
      "storyEnd": {
        "on":"story-last-page-visible",
        "vars": {
          "event_name":"custom",
          "event_action":"story_complete",
          "event_category":"${title}",
          "send_to": [
            "YOUR_GOOGLE_ANALYTICS_ID"
          ]
        }
      }
    }
  }
 </script>
</amp-analytics>

此默认配置应该为您提供 AMP 故事的完整可用配置。

如果您有兴趣了解默认配置之外的功能，请阅读AMP Stories 的分析，以查找 Google Analytics 的更多高级用例。

变量替换

amp-pixel 和 amp-analytics 组件都允许所有标准 URL 变量替换（请参阅AMP HTML 变量替换）。在以下示例中，页面浏览请求会发送到 URL，以及当前 AMP 文档的规范 URL、其标题和客户端 ID

<amp-pixel src="https://example.com/analytics?url=${canonicalUrl}&title=${title}&clientId=${clientId(site-user-id)}"></amp-pixel>

由于其简单性，amp-pixel 标签只能包含由平台定义或 AMP 运行时可以从 AMP 页面解析的变量。在上面的示例中，平台会填充 canonicalURL 和 clientId(site-user-id) 的值。amp-analytics 标签可以包含与 amp-pixel 相同的变量，以及标签配置内唯一定义的变量。

在页面或平台定义的变量的请求字符串中使用格式 ${varName}。amp-analytics 标签会在构建分析请求时将模板替换为其真实值（另请参阅 amp-analytics 中支持的变量）。

在以下 amp-analytics 示例中，页面浏览请求会发送到 URL，其中包含从变量替换中提取的其他数据，其中一些由平台提供，一些在 amp-analytics 配置中内联定义

<amp-analytics>
  <script type="application/json">
    {
      "requests": {
        "pageview":"https://example.com/analytics?url=${canonicalUrl}&title=${title}&acct=${account}&clientId=${clientId(site-user-id)}"
      },
      "vars": {
        "account":"ABC123"
      },
      "triggers": {
        "someEvent": {
          "on": "visible",
          "request": "pageview",
          "vars": {
            "title": "My homepage"
          }
        }
      }
    }
  </script>
</amp-analytics>

在上面的示例中，变量 account 和 title 在 amp-analytics 配置中定义。canonicalUrl 和 clientId 变量未在配置中定义，因此它们的值由平台替换。

重要提示 – 变量替换非常灵活；您可以在不同的位置定义相同的变量，并且 AMP 运行时将按此优先级顺序解析值（请参阅变量替换顺序）。

用户身份识别

网站使用 Cookie 在浏览器中存储特定于用户的信息。Cookie 可用于指示用户之前是否访问过某个站点。在 AMP 中，页面可以从发布商的网站或缓存（如 Google AMP 缓存）中提供。发布商的网站和缓存很可能具有不同的域。出于安全原因，浏览器可以（并且通常会）限制对另一个域的 Cookie 的访问（另请参阅跨来源跟踪用户）。

默认情况下，无论页面是从发布商的原始网站访问还是通过缓存访问，AMP 都会管理客户端 ID 的提供。AMP 生成的客户端 ID 的值为 "amp-"，后跟一个随机的 base64 编码字符串，如果同一用户再次访问，则该值保持不变。

AMP 会管理在所有情况下客户端 ID 的读取和写入。当页面通过缓存提供或以其他方式显示在发布商原始站点的查看上下文之外时，这一点尤其值得注意。在这种情况下，无法访问发布商站点的 Cookie。

当 AMP 页面从发布商的站点提供时，AMP 使用的客户端 ID 框架可以被告知要查找和使用的回退 Cookie。在这种情况下，clientId 变量的 cid-scope-cookie-fallback-name 参数将被解释为一个 Cookie 名称。格式可能显示为 CLIENT_ID(cid-scope-cookie-fallback-name) 或 ${clientId(cid-scope-cookie-fallback-name)}。

例如：

<amp-pixel src="https://foo.com/pixel?cid=CLIENT_ID(site-user-id-cookie-fallback-name)"></amp-pixel>

如果 AMP 发现设置了此 Cookie，则客户端 ID 替换将返回该 Cookie 的值。如果 AMP 发现未设置此 Cookie，则 AMP 将生成一个 amp- 开头，后跟一个随机 base64 编码字符串的值。

要了解有关客户端 ID 替换的更多信息，包括如何添加可选的用户通知 ID，请参阅AMP 分析中支持的变量。

继续通过AMP 分析深入研究和用例来了解有关分析的更多信息。