Fastifyで静的ファイルを返す方法

環境

• Fastify 3.x

やりたいこと

画像とかサーバーにある静的ファイルをを返したい

バイナルファイルもきちんと表示できるようにしたい

【方法１】fs.readFileを使う

一番ベーシック。Fastityに限らず、nodejs使ってるなら標準メソッドで解決しようって考え方である。

せっかくなのでここではasync/awaitを使って実装してみる。

'use strict'
const fs = require('fs').promises

module.exports = async function (fastify, opts) {
  fastify.get('/image', async (req, reply) => {
    const buffer = await fs.readFile('demo.png')
    reply.type('image/png')
    reply.send(buffer)
  })  
}

これで /imageにアクセスすると demo.pngを表示できるAPIサーバーを作成できた。

【方法２】fastify-static

そもそも公式で静的ファイルを表示するのに特化したFastifyのプラグイン、fastify-staticが公開されている。

github.com

これを使わない手はないと思うので早速インストール

yarn add fastify-static

例として、public/demo.pngを表示するAPIを作るとする。

const fastifyStatic = require('fastify-static')
const path = require('path')

module.exports = async function (fastify, opts) {

  fastify.register(fastifyStatic, {
    root: path.join(process.cwd(), 'public')
  })

  fastify.get('/image', (req, reply) => {
    return reply.sendFile('demo.png')
  })
}

ポイントはfastifyStaticをfastify.register()するときのオプションとしてrootは必須ということ

しかも絶対パスなので若干面倒。。。今回はprocess.cwd()でNodejsの実行絶対パスを基点とするようにした

【方法３】