Express.js（ejs使用）で、配列データ一覧を表示させたい

###前提・実現したいこと
Express.jsを使ってあるフォルダのファイルパス一覧を取得したのですが、その配列データをejsで表示させようとしたら、エラーが発生しました。
ファイルパスを格納するスクリプトは以下のサイトを参考に実装しました。
リンク内容

利用環境
0. macbook air バージョン11.5.2
0. node.js v16.8.0
0. express@4.17.1
0. express-generator@4.16.

実装したスクリプト

先のサイトをに参考し、ファイルパスを取得するスクリプト

getFilePath.js

javascript
1// 目的のフォルダがあるパス
2const root = "/Users/user_name/devid_data/";
3const fs = require('fs');
4
5const listFiles = dirPath => {
6    const files = [];
7    const paths = fs.readdirSync(dirPath);
8
9    for (let name of paths) {
10        try {
11            const path = `${dirPath}/${name}`;
12            const stat = fs.statSync(path);
13            switch (true) {
14                case stat.isFile():
15                    files.push(path);
16                    break;
17
18                case stat.isDirectory():
19                    files.push(...listFiles(path));
20                    break;
21
22                default:
23            }
24        } catch (err) {
25            console.error('error:', err.message);
26        }
27    }
28
29    return files;;
30}
31
32exports.files = listFiles(root);
33exports.dir = fs.readdirSync(root);
34
35

ExPressで実装したスクリプト

filePath.js

js
1var express = require("express");
2var router = express.Router();
3// ファイルパス一覧を取得
4var paths = require('../public/javascripts/getFilePath.js');
5
6var files = paths.files;
7var dir = paths.dir;
8
9// ディレクトリを表示
10router.get('/', function(req, res) { ;
11    res.render('index', {dir : dir});
12});
13
14module.exports = router;
15

取得したディレクトリのデータ

[
  'i-4rqsyt4jv9ens16cfi54',
  'i-5e4ulh3jmca7ph7pu6wz',
  'i-8i3x4xg8icngy3wcc54c',
  'i-9pavidstc72v798pj1wc',
  'i-9recr64sazlcbbvxx7vq',
  'i-aounrrql0emnv8af6z1y',
  'i-dbsr1qsuv5zkwmimeoff',
  'i-i5s9c5bdiwntz5w22hna',
  'i-iae78zqdbj175jaq4alg',
  'i-q2ne8j41qxx18dqqst1e',
  'i-szzy0ynmukb0q6xngfgc',
  'i-vmk88y401h30aas4th5k',
  'i-wd1p10p4gnof43shq3we',
  'i-y069sfca7sdozkv9qndo'
]

app.js

js
1var createError = require('http-errors');
2var express = require('express');
3var path = require('path');
4var cookieParser = require('cookie-parser');
5var logger = require('morgan');
6
7var indexRouter = require('./routes/index');
8var usersRouter = require('./routes/users');
9
10// 目的の配列データを取得するスクリプトファイル
11var pathsRouter = require('./routes/filePath');
12
13var app = express();
14
15// view engine setup
16app.set('views', path.join(__dirname, 'views'));
17app.set('view engine', 'ejs');
18
19app.use(logger('dev'));
20app.use(express.json());
21app.use(express.urlencoded({ extended: false }));
22app.use(cookieParser());
23app.use(express.static(path.join(__dirname, 'public')));
24
25app.use('/', indexRouter);
26app.use('/users', usersRouter);
27
28//  ディレクトリを表示させる
29app.use('/', pathsRouter);
30
31// catch 404 and forward to error handler
32app.use(function(req, res, next) {
33  next(createError(404));
34});
35
36// error handler
37app.use(function(err, req, res, next) {
38  // set locals, only providing error in development
39  res.locals.message = err.message;
40  res.locals.error = req.app.get('env') === 'development' ? err : {};
41
42  // render the error page
43  res.status(err.status || 500);
44  res.render('error');
45});
46
47module.exports = app;
48

index.ejs

取得した配列データを表示させたいファイル

ejs
1<!DOCTYPE html>
2<html>
3  <head>
4    <title>サンプル</title>
5    <link rel='stylesheet' href='/stylesheets/style.css' />
6  </head>
7  <body>
8    <div id="file_tree">
9    ***エラーになる***
10        <%= dir%>
11    </div>
12  </body>
13</html>
14

エラー内容

エラー表示の場所は上記の <%= dir%>の所で、メッセージは”dir is not defined”となりました。

hoshi-takanori

2021/09/18 05:48

app.js に app.use('/', indexRouter); app.use('/', pathsRouter); があるので、たぶん indexRouter が優先されてしまい、その中で index.ejs を表示する際に dir が指定されてないのでは。pathsRouter だけならとりあえず表示はされましたよ。