MIMEスニッフィングとX-Content-Type-Options：nosniffの解説

next.config.jsでX-Content-Type-Options: nosniffを設定して、APIルートや静的ファイルルートを含む全レスポンスに適用されるようにします。

// next.config.js
module.exports = {
  async headers() {
    return [
      {
        source: "/:path*",
        headers: [
          { key: "X-Content-Type-Options", value: "nosniff" },
        ],
      },
    ];
  },
};

serverブロックにディレクティブを追加して、nginxを通じて送信されるすべてのレスポンスに適用されるようにします。

add_header X-Content-Type-Options "nosniff" always;

nosniffは各レスポンスが正しいContent-Typeヘッダーも持つ場合に最も効果的です。ユーザーアップロードファイルには適切なタイプを付け、アプリと同じオリジンではなく別のオリジンやストレージドメインから配信することで、ファイルが実行されてもセッションCookieにアクセスできないようにします。

拡張子チェックは回避できます。file-type（npm）などのライブラリを使ってサーバー側でファイルのマジックバイトを検査し、許可された安全なタイプのリストに一致しないものはストレージ層に到達する前に拒否します。

import { fileTypeFromBuffer } from "file-type";

const ALLOWED = new Set(["image/jpeg", "image/png", "image/webp", "image/gif"]);

async function validateUpload(buffer: Buffer): Promise<void> {
  const type = await fileTypeFromBuffer(buffer);
  if (!type || !ALLOWED.has(type.mime)) {
    throw new Error("Upload rejected: unsupported file type");
  }
}