使用 Azure Artifacts 符号服务器源映射安全地调试原始代码
若要在 DevTools 中安全地查看和使用原始开发源代码，而不是 Web 服务器返回的已编译、缩小和捆绑的生产代码，可以使用 Azure Artifacts 符号服务器上发布的源映射。
源映射将编译的生产代码映射到原始开发源文件。 然后，在 DevTools 中，可以查看和使用熟悉的开发源文件，而不是已编译的代码。 若要详细了解源映射和在 DevTools 中使用源映射，请参阅 将已处理的代码映射到原始源代码进行调试。
从 Azure Artifacts 符号服务器下载源映射可以安全地检索原始开发源代码来调试生产网站。
先决条件：将源映射发布到 Azure Artifacts 符号服务器
若要在 DevTools 中使用来自 Azure Artifacts 符号服务器的源映射，需要先将这些映射发布到服务器。
若要了解如何发布源映射，请参阅 通过将源映射发布到 Azure Artifacts 符号服务器来安全地调试原始代码。
步骤 1：在 DevTools 中启用源映射
若要确保在 DevTools 中启用源映射，请：
若要打开 DevTools，请在 Microsoft Edge 中右键单击网页，然后选择“ 检查”。 或者，按 Ctrl+Shift+I (Windows、Linux) 或 Command+Option+I (macOS) 。
在 DevTools 中，单击 “设置” (
) >“首选项”。确保选中 “启用 JavaScript 源映射 ”复选框和 “启用 CSS 源映射 ”复选框：
步骤 2：将 DevTools 连接到 Azure Artifacts 符号服务器
需要将 DevTools 配置为成功检索网站的已发布源映射。
若要配置 DevTools，请创建 Azure Artifacts 符号服务器连接。 有两种类型的连接：Microsoft Entra ID（最容易使用）和个人访问令牌。
使用 Microsoft Entra ID 连接到符号服务器
在 DevTools 中，单击 “设置” (
) >符号服务器。单击“ 添加符号服务器连接 ”，开始创建新连接。
在“授权模式”下拉列表中，选择“Microsoft Entra ID”。
如果禁用“Microsoft Entra ID”选项，请登录到 Microsoft Edge。 有关详细信息，请参阅 登录以跨设备同步 Microsoft Edge。
在 “Azure DevOps 组织”下，单击“ 选择”。
此时会显示你所属的 DevOps 组织列表。
双击要连接到的组织，或单击它，然后按 Enter。
单击“ 添加” 以创建连接。
单击右上角的 “关闭 (
) 按钮关闭 “设置” 面板，然后单击“ 重新加载 DevTools” 按钮。
使用个人访问令牌连接到符号服务器
若要使用个人访问令牌 (PAT) 连接到符号服务器，请先在 Azure DevOps 中生成新的 PAT，然后配置 DevTools。
在 Azure DevOps 中生成新的 PAT
转到 登录到 Azure DevOps 组织
https://dev.azure.com/{yourorganization}。在 Azure DevOps 中，转到 “用户设置>”“个人访问令牌”：
此时会显示 “个人访问令牌 ”页：
单击“ 新建令牌”。 此时会 打开“创建新的个人访问令牌 ”对话框：
在“ 名称 ”文本框中，输入 PAT 的名称，例如“devtool 源映射”。
在 “过期” 部分中，输入 PAT 的到期日期。
在 “范围 ”部分中，单击“ 显示所有范围” 以展开该部分。
向下滚动到 “符号”，然后选中“ 读取 ”复选框。
单击“创建”按钮。 此时将显示 “成功！ ”对话框：
单击“ 复制到剪贴板 ”按钮以复制 PAT。 请确保复制令牌并将其存储在安全位置。 出于安全原因，不会再次显示它。
若要详细了解 PAT，请参阅 使用个人访问令牌。
现已生成新的 PAT。 接下来，配置 DevTools。
配置 DevTools
在 DevTools 中，单击 “设置” (
) >符号服务器。单击“ 添加符号服务器连接 ”，开始创建新连接。
在 “授权模式 ”下拉列表中，选择“ 个人访问令牌”。
在 “Azure DevOps 组织 ”文本框中，输入在其中创建了 PAT 的 Azure DevOps 组织。
在“ 个人访问令牌 ”文本框中，将个人访问令牌粘贴 (PAT) ：
单击“添加”按钮。 连接已创建。
单击右上角的 “关闭 (
) 按钮关闭 “设置” 面板，然后单击“ 重新加载 DevTools” 按钮。
步骤 3：在 DevTools 中检索原始代码
执行上述设置步骤后，使用 DevTools 处理已发布符号的网站内部版本时，现在可以看到原始源代码，而不是转换后的代码。
在 控制台 工具中，从日志消息到源文件的链接将转到原始文件，而不是已编译的文件。
在 源 工具中单步执行代码时，原始文件在左侧的“ 导航器 ”窗格中列出。
在“源”工具中，“调试器”窗格的“调用堆栈”中显示的指向源文件的链接将打开原始源文件。
连接到多个 Azure Artifacts 符号服务器
若要从多个 Azure DevOps 组织提取源映射，请将 DevTools 配置为连接到多个 Azure Artifacts 符号服务器，如下所示：
在 DevTools 中，单击 “设置” (
) >符号服务器。单击“ 添加符号服务器连接 ”以创建其他连接。
配置新连接。 请参阅使用Microsoft Entra ID 连接到符号服务器或使用个人访问令牌连接到符号服务器。
若要编辑或删除现有连接，请将鼠标悬停在该连接上，然后单击“符号服务器设置”页上连接旁边的“编辑 (
) 或“删除 (
) 按钮：
按 URL 筛选源映射
若要确定要通过 Azure Artifacts 符号服务器连接下载的源映射，请使用 筛选器行为 功能。
在 DevTools 中，单击 “设置” (
) >符号服务器。创建新连接或编辑现有连接。
在 “筛选器行为 ”下拉列表中，选择 “排除列表 ”以排除特定的源映射，或选择“ 包含列表” 以仅包含特定的源映射。
在下拉列表下方的文本框中，为要排除或包括的源映射输入每行一个 URL：
单击“ 保存” 按钮。
支持以下通配符：
通配符 含义 ? 匹配单个字符。 * 匹配任何字符的一个或多个。 如果选择“ 排除列表”，DevTools 会尝试查找脚本的任何源映射，但 URL 与列表中的某个条目匹配的脚本除外。
如果选择“ 包含列表”，DevTools 将仅尝试查找具有与列表中条目之一匹配的 URL 的脚本的源映射。 例如，假设在“筛选器行为”下拉列表中选择“包含列表”，然后在“筛选器行为”文本框中输入以下内容：
https://cdn.contoso.com/* https://packages.contoso.com/*在此示例中，DevTools 仅尝试解析与这两个 URL 模式匹配的源映射，不尝试加载其他脚本的源映射。
检查已下载源映射的状态
可以使用源映射监视器工具检查源映射的状态。
若要详细了解 源映射监视器 工具及其如何帮助监视请求的源映射的源文件，以及是否加载了这些源映射，请参阅 源映射监视器工具。
另请参阅
- 通过将源映射发布到 Azure Artifacts 符号服务器来安全地调试原始代码
- 将处理过的代码映射到原始源代码，以便进行调试
- 源映射监视器工具
- DevTools 中的新增功能 (Microsoft Edge 115) 中有关将 DevTools 连接到 Azure Artifacts 符号服务器的改进。