{"meta":{"title":"查找并修复第一个代码漏洞","intro":"了解通过解析 code scanning 演示存储库中的警报来保护代码的基础知识。","product":"开始","breadcrumbs":[{"href":"/zh/get-started","title":"开始"},{"href":"/zh/get-started/learning-to-code","title":"学习编写代码"},{"href":"/zh/get-started/learning-to-code/finding-and-fixing-your-first-code-vulnerability","title":"保护代码"}],"documentType":"article"},"body":"# 查找并修复第一个代码漏洞\n\n了解通过解析 code scanning 演示存储库中的警报来保护代码的基础知识。\n\n在学习编码的过程中，不小心在项目中引入漏洞是很正常的。 如果在分享工作之前不解决这些安全问题，攻击者就会利用它们操纵代码并访问敏感数据，因此尽快识别并修补非常重要。\n\n值得庆幸的是，有些工具可以在你的公共存储库中自动查找、解释甚至修复漏洞。 本教程中，您将学习如何通过code scanning来确保工作安全。\n\n## 设置演示仓库\n\n让我们从复刻一个存在安全漏洞的演示项目开始。 此项目生成一个简单的网页，但由于我们不会部署项目，因此本练习不存在安全风险\\*\\*\\*\\*。\n\n1. 导航到 [`new2code/code-scanning-demo`](https://github.com/new2code/code-scanning-demo) 仓库。\n2. 在页面右上角，单击 <svg version=\"1.1\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"octicon octicon-repo-forked\" aria-label=\"repo forked icon\" role=\"img\"><path d=\"M5 5.372v.878c0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75v-.878a2.25 2.25 0 1 1 1.5 0v.878a2.25 2.25 0 0 1-2.25 2.25h-1.5v2.128a2.251 2.251 0 1 1-1.5 0V8.5h-1.5A2.25 2.25 0 0 1 3.5 6.25v-.878a2.25 2.25 0 1 1 1.5 0ZM5 3.25a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Zm6.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm-3 8.75a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Z\"></path></svg>**“分叉**”。\n3. 在出现的页面中，单击“Create fork”\\*\\*\\*\\*。\n\n## 查找代码中的漏洞\n\n设置项目后，让我们启用您的派生版本中的code scanning 来检查代码中的漏洞。\n\n1. GitHub返回，在存储库的主页上，单击\\*\\*<svg version=\"1.1\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"octicon octicon-shield\" aria-label=\"shield\" role=\"img\"><path d=\"M7.467.133a1.748 1.748 0 0 1 1.066 0l5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667Zm.61 1.429a.25.25 0 0 0-.153 0l-5.25 1.68a.25.25 0 0 0-.174.238V7c0 1.358.275 2.666 1.057 3.86.784 1.194 2.121 2.34 4.366 3.297a.196.196 0 0 0 .154 0c2.245-.956 3.582-2.104 4.366-3.298C13.225 9.666 13.5 8.36 13.5 7V3.48a.251.251 0 0 0-.174-.237l-5.25-1.68ZM8.75 4.75v3a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 1.5 0ZM9 10.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z\"></path></svg> Security and quality\\*\\*。\n2. 在“Code scanning 警报”行中，单击**设置code scanning**。\n3. 在“工具”部分的“CodeQL 分析”旁边，选择“ **设置**”，然后单击“ **默认**”。\n4. 在显示的弹出窗口中，单击“ **启用 CodeQL**”。 这会触发扫描 GitHub Actions 代码中的漏洞的工作流。\n5. 若要检查工作流的状态，请在导航栏中单击“ <svg version=\"1.1\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"octicon octicon-play\" aria-label=\"play icon\" role=\"img\"><path d=\"M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm4.879-2.773 4.264 2.559a.25.25 0 0 1 0 .428l-4.264 2.559A.25.25 0 0 1 6 10.559V5.442a.25.25 0 0 1 .379-.215Z\"></path></svg>**操作**”。\n6. 工作流完成后，在导航栏中单击 **<svg version=\"1.1\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"octicon octicon-shield\" aria-label=\"shield\" role=\"img\"><path d=\"M7.467.133a1.748 1.748 0 0 1 1.066 0l5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667Zm.61 1.429a.25.25 0 0 0-.153 0l-5.25 1.68a.25.25 0 0 0-.174.238V7c0 1.358.275 2.666 1.057 3.86.784 1.194 2.121 2.34 4.366 3.297a.196.196 0 0 0 .154 0c2.245-.956 3.582-2.104 4.366-3.298C13.225 9.666 13.5 8.36 13.5 7V3.48a.251.251 0 0 0-.174-.237l-5.25-1.68ZM8.75 4.75v3a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 1.5 0ZM9 10.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z\"></path></svg> Security and quality**。\n7. code scanning若要查看工作流发现的警报，请在侧导航中单击<svg version=\"1.1\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"octicon octicon-codescan\" aria-label=\"codescan icon\" role=\"img\"><path d=\"M8.47 4.97a.75.75 0 0 0 0 1.06L9.94 7.5 8.47 8.97a.75.75 0 1 0 1.06 1.06l2-2a.75.75 0 0 0 0-1.06l-2-2a.75.75 0 0 0-1.06 0ZM6.53 6.03a.75.75 0 0 0-1.06-1.06l-2 2a.75.75 0 0 0 0 1.06l2 2a.75.75 0 1 0 1.06-1.06L5.06 7.5l1.47-1.47Z\"></path><path d=\"M12.246 13.307a7.501 7.501 0 1 1 1.06-1.06l2.474 2.473a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM1.5 7.5a6.002 6.002 0 0 0 3.608 5.504 6.002 6.002 0 0 0 6.486-1.117.748.748 0 0 1 .292-.293A6 6 0 1 0 1.5 7.5Z\"></path></svg>**Code scanning**，然后单击 **“反射跨站点脚本**”。\n\n## code scanning了解警报\n\n更何况 code scanning 已识别出了代码中的漏洞，接下来我们分解警报中提供的信息。\n\n### 位置\n\n警报显示文件的小预览，重点展示造成漏洞的代码行。 在我们的案例中，在 `index.js` 文件的第 8 行检测到了漏洞，我们在该行实现了网站中用户提供的输入。\n\n如果我们仔细观察，就会发现根本问题出现在第 7 行，即我们在未检查恶意代码的情况下将 `greet` 分配给用户输入。 若要查看代码中漏洞的分步视图，请在漏洞行下方的弹出窗口中单击“显示路径”\\*\\*\\*\\*。\n\n![code scanning 警报位置的屏幕截图。 “Show paths”按钮以橙色框出。](/assets/images/help/repository/code-scanning-alert-location-learners.png)\n\n### 描述和建议\n\n在文件预览下方， code scanning 提供漏洞的更详细说明。 若要查看建议的修补程序，以及易受攻击和固定代码的示例，请单击“ **显示更多**<svg version=\"1.1\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"octicon octicon-chevron-down\" aria-label=\"chevron down icon\" role=\"img\"><path d=\"M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z\"></path></svg>”。\n\n![code scanning 警报详细信息的屏幕截图。 标有“Show more”的下拉列表以橙色框出。](/assets/images/help/repository/code-scanning-alert-details-learners.png)\n\n在我们的案例中，建议是在使用前清理用户输入。 这意味着我们需要检查输入是否有恶意代码，然后在必要时进行清理。\n\n> \\[!TIP] 如果你不完全了解建议的修补程序，请尝试 [请求 Copilot Chat](https://github.com/copilot) 解释它。\n\n### 时间线\n\n最后，可以在页面底部看到警报的时间线。 时间线包含首次检测到漏洞的提交记录，并在我们修复漏洞时自动更新。\n\n![code scanning 警报时间线的屏幕截图。](/assets/images/help/repository/code-scanning-alert-timeline-learners.png)\n\n## 自动修复漏洞\n\n为了快速和轻松地保护我们的项目，让我们使用GitHub Copilot Autofix来处理code scanning。\n\n1. 在警报标题下方的框中，建议你“使用Copilot Autofix加快对此CodeQL警报的修正”，请单击<svg version=\"1.1\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" class=\"octicon octicon-shield-check\" aria-label=\"shield check icon\" role=\"img\"><path d=\"m8.533.133 5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667l5.25-1.68a1.748 1.748 0 0 1 1.066 0Zm-.61 1.429.001.001-5.25 1.68a.251.251 0 0 0-.174.237V7c0 1.36.275 2.666 1.057 3.859.784 1.194 2.121 2.342 4.366 3.298a.196.196 0 0 0 .154 0c2.245-.957 3.582-2.103 4.366-3.297C13.225 9.666 13.5 8.358 13.5 7V3.48a.25.25 0 0 0-.174-.238l-5.25-1.68a.25.25 0 0 0-.153 0ZM11.28 6.28l-3.5 3.5a.75.75 0 0 1-1.06 0l-1.5-1.5a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l.97.97 2.97-2.97a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z\"></path></svg>**生成修复**。\n2. 生成修复建议后 Copilot ，它将描述建议的更改、呈现更改预览以及调用任何添加的依赖项。 花点时间读一读 Copilot 的作品。\n3. 若要创建包含修复的拉取请求，请单击**提交到新分支**，然后单击**提交更改**。\n4. 创建草稿拉取请求后，在页面底部，单击“提交审核”以使其进入可合并状态\\*\\*\\*\\*。\n5. 若要应用修复，请单击“Merge pull request”，然后单击“Confirm merge”\\*\\*\\*\\*\\*\\*\\*\\*。\n\n   合并拉取请求并 code scanning 再次运行工作流后，警报将自动关闭，修复漏洞的提交将添加到时间线。\n\n> \\[!NOTE] 在实际项目中，您应始终在提交更改到代码之前查看由 Copilot 建议的更改。\n\n## 后续步骤\n\n在演示存储库上试用 code scanning 后，可在 **自己的项目中** 快速查找和修复当前和将来的漏洞。\n\n在确保您自己编写的代码安全之后，下一步通过检查依赖项的安全性，进一步提升代码的安全性。 请参阅“[查找并修复第一个依赖项漏洞](/zh/get-started/learning-to-code/finding-and-fixing-your-first-dependency-vulnerability)”。"}