Snyk CodeとVSCodeで開発中コードのセキュリティスキャンをやってみた

こんにちは、AWS事業本部コンサルティング部に所属している今泉(@bun76235104)です。

みなさんは、DevSecOpsしたいですか？私はしたいです。

昨今、ソフトウェア開発のライフサイクルの早い段階からセキュリティに取り組むShift-Leftという考え方が重要になってきていますが、今回は Snyk CodeとVSCodeの拡張機能を使って、コードのセキュリティスキャンを行うことで、開発中に危険なコードを検出できるようにしてみました。

参考: 「(私のように)セキュリティを何から始めれば良いか分からない開発者の方へ」というセッションを視聴しました！ | DevelopersIO

Snyk Codeとは

Snykが提供しているサービスの一つで、コードのセキュリティスキャンを行えます。

詳細はSnyk Code - Snyk User Docsをご参照ください。

さまざまなIDEとの連携も提供されており(IDE plugins | Snyk)、今回はVSCodeを使ってセキュリティスキャンを行ってみようと思います。

なお、今回はSnykのアカウント作成などを既に行っているものとして、検証を進めております。

アカウント作成などはGetting started - Snyk User Docsをご参照ください。

SnykCLIをインストールする方法

まずVSCodeの拡張機能を使う前に、snykコマンドを利用できるように準備します。

OSに応じて公式の手順に従ったインストールを行います。

私の場合Macを利用しているためHombebrewを利用しました。

brew tap snyk/tap
brew install snyk

インストールできたら確認のため以下コマンドを実行します

snyk --version

これでバージョンの情報が出力されればOKです。

以下コマンドでSnykアカウントの認証をしておきましょう。

snyk auth

Organizationsの切り替え方法

snykはデフォルトのOrganizationを利用しようとしますので、会社でOrganizationを作っている場合などは設定を行う必要があります。

筆者の場合、デフォルト設定のままsnyk code test コマンドを実行してしまい、以下の様に出力されていました。

$ snyk code test
> Snyk Code is not supported for org: enable in Settings > Snyk Code

(別Orgの設定画面をみながら)あれ〜有効になっているのになぁ・・・みたいな時間を過ごしてしまいました。

設定方法などはHow to select the organization to use in the CLI – Support Portal | Snykをご参照ください。

SnykのVSCode拡張の設定方法

まずSnykの拡張機能をVSCodeでインストールします。

拡張機能のマーケットで 「snyk」 と検索することで見つかります。

2022年7月26日現在,Snyk Security - Code and Open Source Dependencies - Visual Studio Marketplaceが公式の拡張機能のようですのでインストールを行います。

インストールが完了すると、VSCodeのサイドバーにSnykのマークが現れますのでクリックし、Connect VS Code with Snyk をクリックします。

ブラウザで以下の様な画面に遷移するので Authenticate をクリックします。

VSCodeのSnykの画面にて以下のように Thanks for connectiong with Snyk. と表示されていればログイン完了です。

なお、この画面において以下の様にOrganizationでSnyk Code が有効になっていない旨表示されておりますが、筆者の場合すでに有効化されたOrganizationが用意されていたのでOrganizationの切り替えを行う必要がありました。

(デフォルトのOrganizationでSnyk Codeを有効にしたい場合、画面のナビゲーションに従って有効化すれば良いかと思われます。)

VSCodeのSnyk拡張の設定を行う場合、コマンドパレットを表示(Macの場合 cmd + shift + p を押下)して、Snyk: Settings を実行することで設定画面が開きます。

設定画面の Snyk Advanced: Organization でOrganizationの orgslugname を入力します。 (説明欄に記載されている通りSnykダッシュボードのURLの https://app.snyk.io/org/[orgslugname] orgslugname の部分が設定値となります)

ここまで設定を終えて、VSCodeをリロードすることで準備が整いました。

サンプルプロジェクトで脆弱性を検知してみた

ここで公式が用意してくださっているサンプルプロジェクトを git clone します。

snyk-labs/nodejs-goof: Super vulnerable todo list applicationからcloneできます。

なお、その他言語のサンプルなどもSnyk Labsから探すことができます。

git clone して、 コマンドパレットから Snyk: Rescan コマンドを実行することで以下の様に危険なコードが検出されました。

検出された結果をクリックすることで、どのような理由で検出され、どのように修正することが望ましいかなどを表示してくれます

この場合、詳細に表示されたアドバイスに従って無害化を行うように修正したところスキャン結果から消えました。

before

Todo.findById(req.params.id, function (err, todo) {

    try {
      todo.remove(function (err, todo) {
        if (err) return next(err);
        res.redirect('/');
      });
    } catch (e) {
    }
  });

after

// injectionSanitizeがパラメーターの無害化用の処理と見なしてください
  const id = injectionSanitize(req.params.id)
  Todo.findById(id, function (err, todo) {

    try {
      todo.remove(function (err, todo) {
        if (err) return next(err);
        res.redirect('/');
      });
    } catch (e) {
    }
  });
};

まとめ

冒頭で触れましたが、「Shift-Left」の考えでは、できるだけ早いタイミングでの脆弱性の発見・対処が望ましいとされています。

Snyk Code と各種IDEの拡張機能を利用することで、開発者が自分のコードの脆弱性となりうるポイントを「コードのプッシュ」、「ビルド・デプロイ」より前で把握し、改善することが可能となります。

セキュリティ上の観点からも素晴らしいですし、開発者目線からしても「自分の書いたこのコードがどの様な理由で危険か」というフィードバックを受け続けることができるので、レベルアップにつながりそうで非常に良いと思いました。

以上、簡単ではありますが Snyk Code とVSCodeの拡張機能を利用して、コードのセキュリティスキャンを行いました。

この記事がどなたかの参考になれば幸いです。