1104 SeSAC(새싹) 3기 40일차

육은별·2021년 11월 4일
0

SeSAC(새싹)

목록 보기
31/31
post-thumbnail

multer

파일 업로드를 위한 모듈

npm install multer

const express = require( 'express' );
const app = express();
const port = 9999;

app.use('/img', express.static( __dirname + '/uploads'));

const multer = require( 'multer' ); //모듈 불러오기
// var upload_multer = multer({
//     dest: "uploads/"
// });
const path = require( 'path' ); //내장모듈

var storage = multer.diskStorage({
    destination: ( req, file, cb ) => {
        //dest: "uploads/" 이거랑 똑같음
        cb(null, "uploads");
    },
    filename: (req, file, cb ) => {
        //path라는 모듈을 사용해서 이 파일의 확장자를 가져올 수 있다.
        //extname이라는 함수를 사용하면 .확장자가 나온다.
        //ex) path.extname("1.txt"); --> .txt
        var extname = path.extname(file.originalname);
        var newname = "1.png";
        // cb( null, Date.now() + extname );
        cb( null, file.originalname);
    }
});

var upload_multer = multer({ storage: storage });

app.set( "view engine", "ejs" );
app.set( "views", __dirname + "/views" );

app.get( '/', (req, res) => {
    res.render("upload");
});

app.post("/upload", upload_multer.single("userfile"), (req, res) => {
    //upload_multer.single : 단일파일처리
    //upload_multer.array : 다중파일처리
    //upload_multer.filed
    console.log(req.file);
    res.send("Sucess!");
});

app.post("/upload-multiple", upload_multer.array("userfile"), (req, res) => {
    //upload_multer.single : 단일파일처리
    //upload_multer.array : 다중파일처리
    //upload_multer.filed
    console.log(req.files);
    res.send("Sucess!");
});

app.listen( port, () => {
    console.log( "9999!" );
});
<form action="http://27.96.135.73:9999/upload" method="post" enctype="multipart/form-data">
    <input type="file" name="userfile">
    <input type="submit" value="전송">
</form>

<!-- 다중처리 -->
<form action="http://27.96.135.73:9999/upload-multiple" method="post" enctype="multipart/form-data">
    <input type="file" name="userfile" multiple="multiple">
    <input type="submit" value="전송">
</form>

<img src="img/1.png">
profile
Front-end Engineer, Web Developer & UX/UI Design

0개의 댓글

관련 채용 정보