NestJSでFastifyを使用した画像アップロードの実装方法

NestJSで画像アップロードの処理をしようとしたところ、ほとんどがExpressを使用している記事で、Fastifyを使っているものが皆無だったので、Fastifyでどのように画像アップロードを行うのかをまとめておきます。

公式ドキュメントにもExpressの方法しか載っていませんでした。

Documentation | NestJS - A progressive Node.js framework

---

前提条件

フロントからは画像ファイルとそれに紐づくIDやユーザーの情報をFormDataとして送信している前提です。

// 例
const formData = new FormData();
formData.append('image', selectedFile);
formData.append('entityId', entityId);
formData.append('entityName', entityName);

---

必要なライブラリをインストール

使用するのは、fastify-multipartというライブラリです。

• fastify/fastify-multipart

以下のコマンドでインストールしておきます。

yarn add fastify-multipart

---

main.tsでfastify-multipartを登録

import { fastifyMultipart } from '@fastify/multipart';

async function bootstrap() {
  const app = await NestFactory.create<NestFastifyApplication>(
    AppModule,
    new FastifyAdapter(),
  );
  const configService = app.get(ConfigService);
  await app.register(fastifyMultipart);
  // その他の設定...
}

これでfastify-multipartが使えるようになります。

---

Serviceに実装する

アップロード関数で引数としてreq: FastifyRequestを受け取ります。

const parts = req.parts();

これを実行することで、FormDataを取り出します。partsは非同期のイテラブルなオブジェクトになっているので、for awaitを使って取り出していきます。

for await (const part of parts) {
  if (part.fieldname === 'entityId' && part.type === 'field') {
    entityId = part.value;
  } else if (part.fieldname === 'entityName' && part.type === 'field') {
    entityName = part.value;
  } else if (part.fieldname === 'image' && part.type === 'file') {
    fileBuffer = await part.toBuffer(); // ここはお好きな処理を
  }
}

• fieldname属性はフロントで設定したものです。
• typeがfileの場合、ファイルを取得できます。

上記では取り出したファイルをBuffer型に変換していますが、これをS3にアップロードしてパスだけをDBに保存するなど、さまざまな対応が可能です。

これでNestJSで画像をアップロードすることができます。