multer를 사용하여 파일을 업로드하는 것이 express.js 앱에서 작동하지 않습니다.

Question

저는 프론트 엔드에있는 Express.js와 React.js가있는 간단한 블로그 앱을 가지고 있습니다. Postgres 데이터베이스에 그림을 추가하는 기능을 추가하려고하는데 내 스키마가 이렇게 보입니다.

CREATE TABLE IF NOT EXISTS learningtable (
    id BIGSERIAL PRIMARY KEY, 
    topstuff VARCHAR(255), 
    bottomstuff VARCHAR(255), 
    pic1 bytea 
    ); 

내 업로드 양식은 다음과 같습니다. 이 내 컨트롤러가

 const controller = {};    

    controller.create = (req, res) => { 
    console.log(req.body); 
    console.log(req.file) 
     LearningObject.create({ 
     topstuff: req.body.topstuff, 
     bottomstuff: req.body.bottomstuff, 
     pic1: req.file, 
     }) 
     .then(jsonAfterAdding => { 
     res.json({ 
      message: 'okay', 
      jsonAfterAdding: jsonAfterAdding 
     }); 
     }).catch(err => { 
      console.log(err); 
      res.status(400).json(err); 
       }); 
      }; 

    module.exports = controller; 

const express = require('express'); 
    const myrouter = express.Router(); 
    const controller = require('../controllers/learningController'); 
    const multer = require('multer'); 

    var storage = multer.diskStorage({ 
     destination: function (req, file, cb) { 
     cb(null, 'uploads') 
     }, 
    filename: function (req, file, cb) { 
    cb(null, file.fieldname + '-' + Date.now()) 
     } 
     }) 

    var upload = multer({ storage: storage }) 

    myrouter.post('/', upload.single('pic1'), controller.create); 

    module.exports = myrouter; 

입니다

그리고 내 모델은 내가 req.file 로그 콘솔이

const db = require('../db/config'); 
    const LearningObject = {}; 

    LearningObject.create = (blahblah) => { 
     return db.one (
     `INSERT INTO learningtable 
     (topstuff, bottomstuff, pic1) 
     VALUES ($1, $2, $3) RETURNING * 
     `, 
     [blahblah.topstuff, blahblah.bottomstuff, blahblah.pic1] 
    ); 
    }; 


    module.exports = LearningObject; 

모양처럼

<form onSubmit={this.handleSubmit} > 
     <input type="text" name="topstuff" placeholder="top" onChange={this.handleTopChange} value={this.state.inputTopValue} /> <br/> 
     <input type="text" name="bottomstuff" placeholder="bottomt" onChange={this.handleBottomChange} value={this.state.inputBottomValue} /><br/> 
     <input type="file" name="pic1" /><br/> 
     <input type="submit" value="yeah boy" /> 
    </form> 

내 라우터 파일이 보인다 업로드를 시도한 후에 그것의 정의되지 않은 말한다 . "topstuff"및 "bottomstuff"텍스트가 데이터베이스에 저장되지만 폴더 나 데이터베이스에 그림이 표시되지 않습니다.

Answer 1

는 HTML 파일

<form onSubmit={this.handleSubmit} action='/' method="POST" enctype="multipart/form-data" > 
     <input type="text" name="topstuff" placeholder="top" onChange={this.handleTopChange} value={this.state.inputTopValue} /> <br/> 
     <input type="text" name="bottomstuff" placeholder="bottomt" onChange={this.handleBottomChange} value={this.state.inputBottomValue} /><br/> 
     <input type="file" name="pic1" /><br/> 
     <input type="submit" value="yeah boy" /> 
    </form>