捕获浏览器跟踪以进行故障排除

如果你正在排查 Azure 门户的相关问题,并且需要联系 Azure 支持,则可能需要先捕获一些额外信息。 例如,共享浏览器跟踪、步骤录制和控制台输出可能会很有帮助。 此信息可提供有关问题发生时门户中的具体情况的重要详细信息。

重要

Azure 支持人员仅出于故障排除目的使用这些跟踪。 请小心与你共享跟踪的人员,因为他们可能会包含有关你环境的敏感信息。

可在任何受支持的浏览器上捕获此信息:Microsoft Edge、Safari (Mac) 或 Firefox。 每个浏览器对应的步骤如下所示。

Microsoft Edge

以下步骤说明如何在 Microsoft Edge 中使用开发人员工具。 有关详细信息,请参阅 Microsoft Edge DevTools

  1. 登录 Azure 门户。 在开始跟踪之前登录很重要,这样跟踪就不会包含与帐户相关的敏感信息。

  2. 使用步骤录制器开始录制在门户中执行的步骤。

  3. 在门户中,导航到问题发生之前的步骤。

  4. 按 F12 键启动开发人员工具。 还可从“更多工具”>“开发人员工具”下的工具栏菜单启动这些工具。

  5. 默认情况下,浏览器只保留当前加载页的跟踪信息。 设置以下选项,以便浏览器保留所有跟踪信息,即使重现步骤需要转到多个页面。

    1. 依次选择“控制台”选项卡、“控制台设置”、“保留日志”。

      Screenshot that highlights the Preserve log option on the Console tab in Edge.

    2. 依次选择“网络”选项卡、“保留日志”。

      Screenshot that highlights the Preserve log option on the Network tab in Edge.

  6. 在“网络”选项卡中,依次选择“停止记录网络日志”和“清除”。

    Screenshot showing the Stop recording network log and Clear options on the Network tab in Edge.

  7. 选择“记录网络日志”,然后在门户中重现问题。

    Screenshot showing how to record the network log in Edge.

    你将看到如下图所示的会话输出。

    Screenshot showing session output in Edge.

  8. 重现意外的门户行为后,依次选择“停止记录网络日志”、“导出 HAR”并保存文件。

    Screenshot showing how to Export HAR on the Network tab in Edge.

  9. 停止步骤记录器,并保存记录。

  10. 在“浏览器开发人员工具”窗格中,选择“控制台”选项卡。右键单击其中一条消息,然后选择“另存为…”,并将控制台输出保存为文本文件。

    Sccreenshot showing how to save the console output in Edge.

  11. 将浏览器跟踪 HAR 文件、控制台输出和屏幕录制文件打包到一个压缩的格式,例如 .zip。

Safari

以下步骤说明了如何在 Mac 上的 Apple Safari 中使用开发人员工具。 有关详细信息,请参阅 Safari 开发人员工具概述

  1. 在 Safari 中启用开发人员工具:

    1. 依次选择“Safari”、“Preferences”(首选项)。

    2. 依次选择“Advanced”(高级)选项卡、“Show Develop menu in menu bar”(在菜单栏中显示“开发”菜单)。

      Screenshot of the Safari advanced preferences options.

  2. 登录 Azure 门户。 在开始跟踪之前登录很重要,这样跟踪就不会包含与帐户相关的敏感信息。

  3. 开始记录在门户中执行的步骤。 有关详细信息,请参阅如何在 Mac 上录制屏幕

  4. 在门户中,导航到问题发生之前的步骤。

  5. 依次选择“Develop”(开发)、“Show Web Inspector”(显示 Web 检查器)。

    Screenshot of the

  6. 默认情况下,浏览器只保留当前加载页的跟踪信息。 设置以下选项,以便浏览器保留所有跟踪信息,即使重现步骤需要转到多个页面:

    1. 依次选择“控制台”选项卡、“保留日志”。

      Screenshot that shows the Preserve Log on the Console tab.

    2. 依次选择“Network”(网络)选项卡、“Preserve Log”(保留日志)。

      Screenshot that shows the Preserve Log option on the Network tab.

  7. 在“网络”选项卡上,选择“清除网络项”。

    Screenshot of

  8. 在门户中重现问题。 你将看到如下图所示的会话输出。

    Screenshot that shows the output after you've reproduced the issue.

  9. 重现意外的门户行为后,选择“Export”(导出)并保存文件。

    Screenshot of the

  10. 停止屏幕记录器并保存记录。

  11. 在“浏览器开发人员工具”窗格中,选择“控制台”选项卡,然后展开窗口。 将光标置于控制台输出的开头,然后拖动并选择输出的整个内容。 按命令键+C 复制输出,并将其保存到文本文件中。

    Screenshot that shows where you can view and copy the console output.

  12. 将浏览器跟踪 HAR 文件、控制台输出和屏幕录制文件打包到一个压缩的格式,例如 .zip。

Firefox

以下步骤说明如何在 Firefox 中使用开发人员工具。 有关详细信息,请参阅 Firefox 开发人员工具

  1. 登录 Azure 门户。 在开始跟踪之前登录很重要,这样跟踪就不会包含与帐户相关的敏感信息。

  2. 开始记录在门户中执行的步骤。 在 Windows 上使用步骤记录器,或者查看如何在 Mac 上记录屏幕

  3. 在门户中,导航到问题发生之前的步骤。

  4. 按 F12 键启动开发人员工具。 还可从“更多工具”>“Web 开发人员工具”下的工具栏菜单启动这些工具。

  5. 默认情况下,浏览器只保留当前加载页的跟踪信息。 设置以下选项,以便浏览器保留所有跟踪信息,即使重现步骤需要转到多个页面:

    1. 选择“控制台”选项卡,选择“设置”图标,然后选择“保留日志”。

      Screenshot of the Console setting for Persist Logs.

    2. 选择“网络”选项卡,选择“设置”图标,然后选择“保留日志”。

      Screenshot of the Network setting for Persist Logs.

  6. 在“网络”选项卡上,选择“清除”。

    Screenshot of the

  7. 在门户中重现问题。 你将看到如下图所示的会话输出。

    Screenshot showing example browser trace results.

  8. 重现意外的门户行为后,选择“全部另存为 HAR”。

    Screenshot of the

  9. 停止 Windows 上的步骤录制或 Mac 上的屏幕录制,并保存录制。

  10. 回到“浏览器开发人员工具”窗格中,选择“控制台”选项卡。右键单击其中一条消息,然后选择“将所有消息保存为文件”,并将控制台输出保存为文本文件。

    Screenshot of the Save All Messages to File command on the Console tab.

  11. 将浏览器跟踪 HAR 文件、控制台输出和屏幕录制文件打包到一个压缩的格式,例如 .zip。

后续步骤