Node.js+Express+Multerでアップロードしたファイルを表示する

NodeJS

前提

public/uploads ディレクトリに画像が保存されたとします。

views/images.ejs

こんな感じで画像一覧を表示したいとします。

<% images.forEach(image => { %>
  <img src=<% image %> >
<% }); %>

app.js

const fs = require('fs');

app.get('/images', (req, res, next) => {
  
  // fsのメソッドである readdirSync で指定ディレクトリ内のデータを配列で取得
  const images = fs.readdirSync('./public/uploads');
  
  // readdirすると非同期処理となるので、データを取得せずにres.renderされてしまう
  if (images.length >= 0) {
    res.render('images.ejs', {images: images});
  } else {
    console.log('データを取得できませんでした');
  }
});

fsはファイルを扱うためのモジュールです。

node.jsが最初から提供しているモジュールなので、Node.jsのインストールがしてあれば、

fsモジュールをインストールする必要はありません。

参考サイト

https://zenn.dev/kazuma_soon/articles/3178d6a78df9f9

fsモジュールについて(https://qiita.com/tarotaro1129/items/135ef8d8ce4c1c08c9bb

BACK