반응형
<!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>
<!-- 일반 파일 업로드 -->
<form method="POST" enctype="multipart/form-data" action="./upload">
<input type="file" name="userfile" />
<input type="submit" value="전송하기" />
</form>
<!-- 일반 다중파일 업로드 -->
<br />
<br />
<br />
<hr />
<form
method="POST"
enctype="multipart/form-data"
action="./upload-multiple"
>
<input type="file" name="many" multiple />
<input type="text" name="title" />
<input type="submit" value="전송하기" />
</form>
<br />
<br />
<br />
<hr />
<!-- 파일을 여러개 업로드하지만 input태그나 폼데이터의 키가 다른경우 -->
<form
method="POST"
enctype="multipart/form-data"
action="./upload-multiple-fields"
>
<input type="file" name="file1" />
<input type="file" name="file2" />
<input type="text" name="title" />
<input type="submit" value="전송하기" />
</form>
<br />
<br />
<br />
</body>
</html>
single 옵션을 사용하면 단일 파일 받아오기
array로 받아오면 배열 형태로 (input type="file" multiple) 파일들을 받아오기
fields 를 활용하면 upload.fields([{name : 'file1'}, {name : 'file2'}] 형태로 직접 정의를하고 각각 name에 맞게 받아 올 수 있다.
index.js
const express = require("express");
const multer = require("multer");
const fs = require("fs");
const path = require("path");
const app = express();
app.set("view engine", "ejs");
app.use(express.urlencoded({ extended: false }));
app.use(express.json());
app.use(express.static(`${__dirname}/public`));
app.get("/", (req, res, next) => {
console.log(__dirname);
return res.render("index");
});
// const upload = multer({dest:'uploads/'});
const upload = multer({
storage: multer.diskStorage({
// set a localstorage destination
// 어떤이름으로 저장할지가 들어있다.
//위치 지정
destination: (req, file, done) => {
done(null, "uploads/");
},
//지정
// convert a file name
filename: (req, file, done) => {
const ext = path.extname(file.originalname);
done(null, path.basename(file.originalname, ext) + Date.now() + ext);
// cb(null, new Date().valueOf() + path.extname(file.originalname));
},
}),
limits: { fileSize: 5 * 1024 * 1024 },
});
app.post("/upload", upload.single("userfile"), (req, res) => {
// return res.render("di")
console.log(req.file);
});
app.post("/upload-multiple", upload.array("many"), (req, res) => {
// return res.render("di")
console.log(req.files);
});
app.post(
"/upload-multiple-fields",
upload.fields([{ name: "file1" }, { name: "file2" }]),
(req, res) => {
// return res.render("di")
console.log(req.files);
}
);
app.listen(8000, () => console.log("8000포트 대기중"));
반응형
'Node.js > node 활용하기' 카테고리의 다른 글
| node - winston node.js 로그 관리하기 - 기본 명령어, 적용하기 (0) | 2021.07.11 |
|---|---|
| node - pm2로 node.js 프로세스 관리하기 - 기본 명령어, 실행하기 (0) | 2021.07.10 |
| express mongodb 활용하기 - 로그아웃 구현하기, cors 적용하기 (마무리) (0) | 2020.06.28 |
| express mongodb 활용하기 - auth middleware 구현하기 (0) | 2020.06.28 |
| express mongodb 활용하기 - 로그인 기능 만들기 (jwt) (5) | 2020.06.28 |
