预览和调试容器

确保您网站的代码功能符合预期。

通过 Google 跟踪代码管理器的预览模式,您可以查看网站实现了容器代码后的情况(就好像当前的容器草案已经部署到该网站)。网站启用预览模式后,网站内容下方显示调试程序窗格,让您可以查看触发的代码及触发顺序。

请注意:调试窗格目前不可用于移动应用容器。要详细了解如何预览和调试移动应用容器,请参考 iOSAndroid 开发者文档。

本文包含的主题:

启用预览模式

要启用预览模式,请点击发布按钮旁边的箭头,然后选择预览

您还可以预览容器的任何版本。版本实际上是保存的容器快照。要预览旧版本的容器,请转至版本标签,在所需版本旁边选择操作 → 预览
启用预览模式后,“工作区概览”页面上将显示橙色预览通知横幅。

使用预览模式

启用预览模式后,请转至已实现容器的网站,您将在浏览器底部看到一个调试控制台窗口,其中显示了有关您的代码的详细信息(包括代码的触发状态以及正在处理的数据)。此控制台窗口只在您预览网站时显示在您的计算机中,网站的其他访问者看不到该窗口。

您可以使用调试控制台中的这一信息来了解代码和触发器是否触发,以及它们向各自的服务传送了哪些数据。当点击后到达预览的网站时,调试控制台将更新代码触发信息。您可以使用此信息了解代码是否触发以及触发(或不触发)其触发状态的因素。

在调试控制台的左侧栏中,您将看到一个列表,其中包含所有已推送到数据层的事件(按推送的顺序排列)。选择相应的事件,您便可以查看特定事件的容器状态的快照。

位于事件列表顶部的是摘要选项,该选项用于显示容器的相关汇总信息。当您查看“代码”标签下的“摘要”时,系统将显示一个包含目前为止该页面上已触发的所有代码的列表,以及一个包含已设置但尚未触发的代码的列表。点击此视图中的代码将显示该代码的相关信息,如代码属性、触发触发器和屏蔽触发器。当您查看数据层标签下的摘要时,系统将显示最近推送到数据层的五个事件以及针对每个事件设置的附加变量,同时还显示跟踪代码管理器中数据层的当前状态。

您可以从左侧栏中选择任意事件,并点击面板顶部的相应按钮,以便查看代码、变量和数据层的状态。

在左侧栏中选择某个事件后,代码标签将显示为该事件设置的代码。显示的代码分为两类:已在选定的事件上触发;尚未在选定的事件上触发。点击此视图中的代码将显示该代码的属性和属性值,以及该代码的触发触发器和屏蔽触发器的详细信息。在此视图中,代码中使用的变量都以单元的形式显示,利用页面顶部的选择器,您可以切换变量的显示形式:显示变量的名称,或显示变量的解析值。

变量标签将显示所选事件中的变量的详细信息,包括变量的类型、返回数据的类型以及解析值。

数据层标签将准确显示针对选定事件推送到数据层的消息对象,以及消息传输完成后数据层的状态。

共享预览模式

当您启用预览模式时,只有通过激活预览模式的浏览器,才能看到预览的容器配置和调试程序窗格。但是,您可以通过共享预览功能与他人共享预览模式。

要共享预览模式,请点击预览通知横幅中的共享预览。这将显示一个对话框,供您复制网址以发送给其他人。输入网站域名(例如 https://example.com/),然后复制在下面的框中生成的预览网址。

这时就可以将预览网址发送给其他人。预览网址会将用户引导至着陆页,同时会在着陆页中提醒用户他们的浏览器已经启用了预览模式。着陆页上也会提供一个链接,用于停用该浏览器的预览模式。

退出预览模式

要从容器退出预览模式,请点击“工作区概览”页橙色横幅中的退出预览模式

对于共享预览,请使用收到的链接访问共享预览着陆页。然后,点击退出预览和调试模式即可结束预览会话。

本文是否对您有帮助?
您有什么改进建议?