Vibe CodingでNode.jsのファイルアップロードAPIを作成した結果、セキュリティ脆弱性が発生

そう、Vibe Coding。人工知能は、ソフトウェア開発者やエンジニアリングの経験がない人にとって、まさに天からの贈り物です。生産性を高め、コスト削減と迅速なアプリケーション開発を実現するものですが、大規模言語モデルが生成するコードの安全性をどこまで信頼できるのでしょうか？

この説を確かめるため、最新の基盤モデルを搭載したChatGPTに、Node.jsでAPIエンドポイントを作成するよう依頼し、安全なコーディング規約にどの程度準拠するか見てみましょう。

Vibe CodingでNode.jsのファイルアップロードAPIを作成

次のようなケースを想像してください。Fastify Webフレームワークで動作するNode.jsアプリケーションに、ファイルアップロード用のAPIエンドポイントを構築する仕事を任されました。

バックエンドでファイル処理をした経験がなく、Webサーバーでファイルを処理するために、バイナリデータストリームを扱う適切なWebの仕組みがよくわからないということもあるでしょう。

HTTPのマルチパートフォームとは何でしょう？どのAPIを検索して学べばよいのか、何から始めればよいのか迷うかもしれません。少し行き詰まってしまいましたか？よくあることです。

以前なら、Googleで検索してStackOverflowのページにたどり着き、回答を読み比べたことでしょう。でも今は？生成AIに質問すれば、具体的な要件に基づいた動作するコードを提示してもらえます。

ChatGPTに聞いてみましょう。

以下の動画では、Fastifyのルートとして使用するファイルアップロード用POSTエンドポイントを、/api/uploadsに実装するようChatGPTに指示する様子をご覧いただけます。

ChatGPTはコードキャンバスのセッションを開始し、必要なコンポーネントを読み込むNode.jsコードの生成を始めます。

• Fastifyパッケージをインポート

• ファイル処理用のFastify Multipartヘルパーパッケージをインポート

• ファイルシステムとパスを扱うNode.jsのコアモジュールをインポート

続いて、Fastifyに@fastify/multipartプラグインを登録し、/api/uploads APIエンドポイントを定義するアプリケーションロジックを生成します。このコントローラー関数はユーザー入力からファイルデータを受け取り、ディスクに保存するパスを組み立てて、データをそこにストリーミングします。

こちらが動作するコードです。セキュリティ脆弱性を見つけられるでしょうか？

import fastify from 'fastify';
import multipart from '@fastify/multipart';
import fs from 'fs';
import path from 'path';

const fastify = Fastify({ logger: true });

// Register multipart plugin
fastify.register(multipart);

// Ensure the uploads directory exists
const uploadDir = path.join(process.cwd(), 'uploads');
if (!fs.existsSync(uploadDir)) {
  fs.mkdirSync(uploadDir);
}

fastify.post('/api/uploads', async (req, reply) => {
  const data = await req.file();
  if (!data) {
    return reply.status(400).send({ error: 'No file uploaded' });
  }

  const filePath = path.join(uploadDir, data.filename);
  const writeStream = fs.createWriteStream(filePath);
  await data.file.pipe(writeStream);

  return reply.send({ message: 'File uploaded successfully', filename: data.filename });
});

const start = async () => {
  try {
    await fastify.listen({ port: 3000 });
    console.log('Server running on http://localhost:3000');
  } catch (err) {
    fastify.log.error(err);
    process.exit(1);
  }
};

start();

ChatGPTが引き起こしたセキュリティ脆弱性

ChatGPTが生成した上記のserver.jsコードに潜む巧妙なセキュリティ脆弱性に気づいたでしょうか。脆弱なファイルアップロードAPIルートで何が起きているのか、説明します。

このセキュリティ脆弱性は、次のエンドポイントでファイルパスを処理する方法に起因しています。

fastify.post('/api/uploads', async (req, reply) => {
  const data = await req.file();
  if (!data) {
    return reply.status(400).send({ error: 'No file uploaded' });
  }

  const filePath = path.join(uploadDir, data.filename);
  const writeStream = fs.createWriteStream(filePath);
  await data.file.pipe(writeStream);

  return reply.send({ message: 'File uploaded successfully', filename: data.filename });
});

filePath変数は、ユーザーが指定したファイル名（data.filename)）を、境界となるルートディレクトリuploadDirに連結して生成されます。

ユーザーがアップロードするファイル名を../../app.jsにしてsomething.zipにしないよう、何が防いでいるのでしょうか？何もありません。攻撃者はファイル名を自由に細工し、機密性の高いアプリケーションファイルやOSファイルを上書きできます。プロセスの権限次第では、システムを停止させたり、さらに深刻な場合はデータを盗み、コマンド＆コントロールを確立して攻撃を拡大したりする可能性があります。

SnykでAI生成コードを安全に

コードの生成元がChatGPTでも、Claude 3.7 Sonnetモデルでも、StackOverflowの回答ページでも、チームメイトでも、Snykは問いません。IDE内のコードに脆弱性が見つかると、Snyk拡張機能が検出して警告します。

実際の動作を見てみましょう。ChatGPTが生成したFastifyのファイルアップロードAPIコードをVS Code IDEにコピー＆ペーストし、ファイルを保存するとすぐにSnykが静的解析によるセキュリティスキャンを実行し、パストラバーサルの脆弱性を検出します。

Snykは、開発者にとってなじみやすい、さりげない開発体験を提供します。静的コード解析（リンターとも呼ばれます）で使われるような構文ハイライトを用いて、修正が必要な安全でないコード行に開発者の注意を促します。

Snyk Agent Fix

Snyk Agent AI Fixはさらに一歩進み、Snyk独自のエンジンを活用して、セキュリティ脆弱性のないコードを生成します。

セキュリティの専門家である必要も、セキュリティのベストプラクティスに関するドキュメントを読んで時間を費やす必要もありません。もちろん、それは大いに歓迎しますし、おすすめもします。Snykは、開発者がドメインロジックや中核となるエンジニアリングスキルに時間を使うほうがよいと考え、コードのセキュリティ修正を自動化します。

Snyk DeepCore AI Fixの魔法が働く様子をご覧ください。

Snyk IDE拡張機能は無料で利用開始でき、コード、依存関係、クラウド設定をスキャンします。コードのセキュリティ対策をお見逃しなく。Vibe Codingでもそうでなくても、安全なコードをリリースしましょう。