백엔드넘어렵
150
2019-07-07 18:06:25
3
239

[nodejs] 모달창에서 ajax로 파일업로드가 안되네요..


안녕하세요.

프로젝트하고 있는 대학생입니다.

파일업로드기능이 필요해서 블로그 참고해서 짜봤는데 잘안되서 질문드립니다.


/upload 라우팅 처리하는 부분



router.post('/upload', function (req, res) {
    console.log('/upload 호출됨.');
    var form = new multiparty.Form({
        autoFiles: false, // 요청이 들어오면 파일을 자동으로 저장할 것인가
        uploadDir: 'temp/', // 파일이 저장되는 경로(프로젝트 내의 temp 폴더에 저장됩니다.)
        maxFilesSize: 1024 * 1024 * 5 // 허용 파일 사이즈 최대치
    });
 
    form.parse(req, function (error, fields, files) {
        // 파일 전송이 요청되면 이곳으로 온다.
        // 에러와 필드 정보, 파일 객체가 넘어온다.
        var path = files.fileInput[0].path;
        console.log('path : ' + path);
        res.send(path); // 파일과 예외 처리를 한 뒤 브라우저로 응답해준다.
    });
}); 


파일 업로드와 jquery부분(mainpage.ejs)


<form method = "post" action = "/upload"  enctype = "multipart/form-data" id = "fileForm">
                       <div class = "form-group">
                       <div class = "ch_thumbnail">
                        <label>섬네일</label>
                        <input type = "file" name = "fileInput" id = "fileInput" class = "form-control"
                        >
                        </div>
                        </div>
                        </form>


 <script>
    $('#fileInput').on('change', function () {
        var form = $('#fileForm')[0];
        var formData = new FormData(form);
        console.log('formData : ' + formData);
 
        $.ajax({
            type: 'post',
            url: '/upload',
            data: formData,
            processData: false,
            contentType: false,
            success: function (data) {
                $('#filePath').val(data);
            },
            error: function (err) {
                console.log(err);
            }
        });
    });
</script>


서버실행하고 파일업로드부분에서 파일 선택하면 밑에 처럼 에러뜨네요.. 

/upload 호출됨.
uncaughtException 발생함 : TypeError: Cannot read property '0' of undefined
서버 프로세스 종료하지 않고 유지함.
TypeError: Cannot read property '0' of undefined
at C:\Users\wodus\Desktop\파일업로드3\app.js:151:35
at C:\Users\wodus\Desktop\파일업로드3\node_modules\multiparty\index.js:136:9
at C:\Users\wodus\Desktop\파일업로드3\node_modules\multiparty\index.js:115:9
at processTicksAndRejections (internal/process/task_queues.js:81:9)


var path 에 대입하는값 이것저것 바꿔서 해봤는데 안되고 모르겠네요ㅜㅜ

선배님들 도와주시면 정말 감사하겠습니다 ..


0
0
  • 답변 3

  • 아스키
    10k
    2019-07-08 03:28:59

    아래 처럼 테스트 해보세요..

    router.post('/upload', function(req, res) {

    var form = new multiparty.Form();
    // get field name & value
    form.on('field', function(name,value) {
    console.log("normal field/name="+name+", value="+value);
    });
    // file upload handling
    form.on('part', function(part) {
    var filename;
    var size;
    if(part.filename) {
    filename = part.filename;
    size = part.byteCount;
    } else {
    part.resume();
    }
    console.log('Write Streaming file : ' + filename);
    var writeStream = fs.createWriteStream('/tmp/'+filename);
    writeStream.filename = filename;
    part.pipe(writeStream);
    part.on('data', function(chunk) {
    console.log(filename+'read'+chunk.length+'bytes');
    });
    part.on('end', function() {
    console.log(filename+'Part read complete');
    writeStream.end();
    });
    });
    0
  • 백엔드넘어렵
    150
    2019-07-14 17:06:18
    ReferenceError: multiparty is not defined
       at C:\Users\wodus\Desktop\모달창 파일업로드하기\routes\channel.js:301:16
       at Layer.handle [as handle_request] (C:\Users\wodus\Desktop\모달창 파일업로드하기\node_modules\express\lib\router\layer.js:95:5)
       at next (C:\Users\wodus\Desktop\모달창 파일업로드하기\node_modules\express\lib\router\route.js:137:13)
       at Route.dispatch (C:\Users\wodus\Desktop\모달창 파일업로드하기\node_modules\express\lib\router\route.js:112:3)
       at Layer.handle [as handle_request] (C:\Users\wodus\Desktop\모달창 파일업로드하기\node_modules\express\lib\router\layer.js:95:5)
       at C:\Users\wodus\Desktop\모달창 파일업로드하기\node_modules\express\lib\router\index.js:281:22
       at Function.process_params (C:\Users\wodus\Desktop\모달창 파일업로드하기\node_modules\express\lib\router\index.js:335:12)
       at next (C:\Users\wodus\Desktop\모달창 파일업로드하기\node_modules\express\lib\router\index.js:275:10)
       at urlencodedParser (C:\Users\wodus\Desktop\모달창 파일업로드하기\node_modules\body-parser\lib\types\urlencoded.js:100:7)
       at Layer.handle [as handle_request] (C:\Users\wodus\Desktop\모달창 파일업로드하기\node_modules\express\lib\router\layer.js:95:5)
    0
  • 백엔드넘어렵
    150
    2019-07-14 17:08:44 작성 2019-07-14 17:09:43 수정됨

    /아스키 님말대로 했더니 위에처럼 오류뜨는데 어떡하죠..

    라우터함수 있는 파일에 

    var multiparty = require('multiparty'); 이렇게 정의하고 모듈 설치해도 안되네요..

    0
  • 로그인을 하시면 답변을 등록할 수 있습니다.