multer

Install

npm i multer

multer - npm

ディレクトリ構成

exapp
- ...
- routes
  - file
- tmp
- upload
- views
  - fileup
    - index.ejs
- app.js
- ...

1つのファイルをアップロードする

exapp\app.js

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var topsRouter = require('./routes/tops');
var fileupRouter = require('./routes/fileup');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/tops', topsRouter);
app.use('/fileup', fileupRouter);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

exapp\views\fileup\index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <p class="message" id="message"><%= message %></p>
  <form id="form" method="POST" enctype="multipart/form-data" action="/fileup">
    <p><input type="file" name="file1" /></p>
    <p><input type="submit" value=" 送信 " /></p>
  </form>
</body>
</html>

exapp\routes\fileup.js

var express = require('express');
const path = require('path');
const fs = require('fs');
const multer = require('multer');
const app_path = path.dirname(__dirname).replace(/\\/g, "/"); // アプリのルートディレクトリ
const upload = multer({ dest: app_path + "/tmp"}); // 一時ディレクトリ

var router = express.Router();

router.get('/', function(req, res, next) {
  res.render('fileup/index', { message: "" });
});

router.post('/', upload.single('file1'), function(req, res, next){
  const tem_path = req.file.path.replace(/\\/g, "/");

  if (tem_path) {
      const after_path = app_path + "/upload/" + req.file.originalname; // ファイルの保存場所
      fs.renameSync(tem_path, after_path);
      res.render('fileup/index', { message: "アップロードされました。" });
  } else {
      res.render('fileup/index', { message: "エラー：アップロードできませんでした。" });
  }
});

module.exports = router;

複数のファイルのアップロード

exapp\views\fileup\index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <p class="message" id="message"><%= message %></p>
  <form id="form" method="POST" enctype="multipart/form-data" action="/fileup">
    <p><input type="file" name="file1" multiple /></p>
    <p><input type="submit" value=" 送信 " /></p>
  </form>
</body>
</html>

exapp\routes\fileup.js

const express = require('express');
const path = require('path');
const fs = require('fs');
const multer = require('multer');
const app_path = path.dirname(__dirname).replace(/\\/g, "/"); // アプリのルートディレクトリ
const upload = multer({ dest: app_path + "/tmp"}); // 一時ディレクトリ

const router = express.Router();

router.get('/', function(req, res, next) {
  res.render('fileup/index', { message: "" });
});

const MAXFILES = 3;
router.post('/', upload.array('file1', MAXFILES), function(req, res, next){
  const n = req.files.length;

  try {
    for(let i = 0; i < n; i++){
      let tem_path = req.files[i].path.replace(/\\/g, "/");
      const after_path = app_path + "/upload/" + req.files[i].originalname; // ファイルの保存場所
      fs.renameSync(tem_path, after_path);
    }
    res.render('fileup/index', { message: "アップロードされました。" });
  }
  catch (err){
    res.render('fileup/index', { message: "エラー：アップロードできませんでした。" });
  }
});

module.exports = router;