■
やりたいこと
1つのformタグから複数画像をアップロード
myprofileEdit.ejs
<form action="/myprofile_img" method="post" enctype="multipart/form-data">
プロフィール写真の変更<input type="file" name="account_img"><br>
店舗詳細写真の変更 <input type="file" name="shop_img"><br>
店舗画像１<input type="file" name="img1"><br>
店舗画像２<input type="file" name="img2"><br>
</form>
myprofile_img.js
const express = require('express');
const router = express.Router();
const connection = require('../mysqlConnection');
const multer = require('multer');//画像取得ようパッケージ（multer）読み込み
const moment = require('moment');//日付取得用パッケージ読み込み
const storage = multer.diskStorage({
cb(null, './public/images/uploads')
},
filename: function (req, file, cb) {
cb(null, Date.now() + '-' + Math.round(Math.random() * 1E9)+file.originalname)
}
})
// const upload = multer({ dest: './public/images/uploads' })//ファイルの保存先指定
const upload = multer({ storage: storage })
const path = require('path')
router.get('/', (req, res) => {
res.sendFile(path.join(__dirname, 'views/myprofile.ejs'))
}) ;
var cpUpload = upload.fields([{
name:'account_img', maxCount:1
},{
name:'shop_img', maxCount:1
},{
name:'img1', maxCount:1
},{
name:'img2', maxCount:1
}
]);
//送信する画像が1つの時第二引数は 「upload.single('account_img')」を使う
router.post('/', cpUpload, function (req, res, next) {
console.log('req.filesここからここからここからここからここからここから')
console.log(req.files)
console.log("req.files000000000000000000000000000000")
console.log(req.files.account_img)//ok
console.log(req.files.account_img[0])//ok
// res.redirect('/myprofile')
})
module.exports = router;
これでアップロードしたファイルの名前を取得するために検証を以下で進める
↓
console.log(req.files)
この値をターミナルでみると
[Object: null prototype] {
account_img: [
{
fieldname: 'account_img',
encoding: '7bit',
size: 1249386
}
],
shop_img: [
{
fieldname: 'shop_img',
encoding: '7bit',
size: 20278
}
],
img1: [
{
fieldname: 'img1',
encoding: '7bit',
size: 222415
}
],
img2: [
{
fieldname: 'img2',
originalname: 'a0258141_2455659.jpg',
encoding: '7bit',
filename: '1599803609358-937438576a0258141_2455659.jpg',
path: 'public/images/uploads/1599803609358-937438576a0258141_2455659.jpg',
size: 17810
}
]
}
さらに細かくみていく
console.log(req.files.account_img)
でみると
[
{
fieldname: 'account_img',
encoding: '7bit',
size: 1249386
}
]
次に
console.log(req.files.account_img[0])
でみると
{
fieldname: 'account_img',
encoding: '7bit',
size: 1249386
}
そして
console.log(req.files.account_img[0].filename)
でみると
ついに画像の名前を取得できた！
