Skip to main content

最初のコードの脆弱性を見つけて修正する

デモ リポジトリで code scanning アラートを解決して、コードをセキュリティで保護する基本について説明します。

コーディングを学習している段階では、プロジェクトに誤って脆弱性を持ち込んでしまうことはよくあります。 作業を共有する前にこれらのセキュリティの問題に対処しないと、攻撃者がそれを利用してコードを操作し、機密データにアクセスする可能性があります。そのため、できるだけ早く特定してパッチを適用することが重要です。

幸いなことに、code scanning などのツールを使うと、パブリック リポジトリ内の脆弱性を自動的に検出し、説明し、さらには修正することもできます。 このチュートリアルでは、code scanning を使って作業を安全に保つ方法について説明します。

デモ リポジトリの設定

セキュリティの脆弱性を持つデモ プロジェクトをフォークすることから始めましょう。 このプロジェクトは単純な Web ページを構築しますが、プロジェクトを配置しないため、この演習ではセキュリティ リスクはありません

  1. new2code/code-scanning-demo リポジトリに移動します。
  2. ページの右上にある [ Fork] をクリックします。
  3. 表示されたページで、[Create fork] をクリックします。

コードの脆弱性を見つける

プロジェクトを設定したので、フォークの code scanning をオンにして、コードの脆弱性をチェックしましょう。

  1. GitHub に戻り、リポジトリのホーム ページで、[ Security] をクリックします。
  2. "Code scanning alerts" 行で、[Set up code scanning] をクリックします。
  3. [Tools] セクションの [CodeQL analysis] の横にある [Set up] を選んでから、[Default] をクリックします。
  4. 表示されるポップアップで、[Enable CodeQL] をクリックします。 これにより、コードの脆弱性をスキャンする GitHub Actions ワークフローがトリガーされます。
  5. ワークフローの状態をチェックするには、ナビゲーション バーで [Actions] をクリックします。
  6. ワークフローが完了したら、ナビゲーション バーで [ Security] をクリックします。
  7. ワークフローによって検出された code scanning アラートを表示するには、サイド ナビゲーションで [ Code scanning] をクリックし、次に [Reflected cross-site scripting] をクリックします。

code scanning アラートについて

code scanning によってコードの脆弱性が特定されたので、アラートで提供された情報を詳しく見ていきましょう。

Location

アラートには、脆弱性を生み出すコード行を中心に、ファイルの小さなプレビューが表示されます。 この例では、脆弱性はサイト内でユーザー指定の入力を実装する index.js ファイルの 8 行目に検出されています。

詳しく見てみると、7 行目で、悪意のあるコードをチェックせずにユーザーによる入力に greet を割り当てるときに根本的な問題が発生していることがわかります。 コード内の脆弱性を段階的に表示するには、脆弱な行の下の吹き出しで [Show paths] をクリックします。

code scanning アラートの場所のスクリーンショット。 [Show paths] ボタンがオレンジ色で囲まれています。

説明と推奨事項

ファイル プレビューの下には、code scanning によって、脆弱性に関するより詳細な説明が表示されます。 推奨される修正と、脆弱なコードと修正されたコードの例を表示するには、[Show more ] をクリックします。

code scanning アラートの詳細のスクリーンショット。 [Show more] というラベルのドロップダウンがオレンジ色で囲まれています。

ここでは、ユーザーによる入力を使う前にサニタイズすることをお勧めします。 つまり、入力に悪意のあるコードが含まれるかチェックし、必要に応じてクリーンする必要があります。

ヒント

推奨される修正方法を完全に理解できない場合は、Copilot Chat に説明を求めてみてください。

タイムライン

最後に、ページの下部にアラートのタイムラインが表示されます。 タイムラインには脆弱性が最初に検出されたコミットが含まれており、脆弱性を修正すると自動的に更新されます。

code scanning アラートのタイムラインのスクリーンショット。

脆弱性を自動的に修正する

プロジェクトをすばやく簡単にセキュリティで保護するには、code scanning に GitHub Copilot Autofix を使います。

  1. アラートのタイトルの下にある [Speed up the remediation of this alert using Copilot Autofix for CodeQL] と提案するボックスで、[ Generate fix] をクリックします。

  2. Copilot が修正候補を生成すると、提案されている変更が説明され、変更のプレビューが表示され、追加された依存関係が呼び出されます。 時間を取って、Copilot の作業内容を読んでみてください。

  3. 修正を含む pull request を作成するには、[Commit to new branch] をクリックし、[Commit change] をクリックします。

  4. ドラフトの pull request が作成されたら、ページの下部にある [Ready for review] をクリックして、マージできるようにします。

  5. 修正を適用するには、[Merge pull request] をクリックして、[Confirm merge] をクリックします。

    Pull request がマージされ、code scanning ワークフローが再度実行されると、アラートは自動的に閉じられ、脆弱性を修正するコミットがタイムラインに追加されます。

メモ

実際のプロジェクトでは、Copilot によって提案された変更をコードにコミットする前に必ずレビューする必要があります。

次のステップ

code scanning をデモ リポジトリで試しましたので、自身のプロジェクトで有効にして、現在および将来の脆弱性をすばやく見つけて修正してください。