Nodejs上传图片req.file未定义

时间:2021-02-13 08:25:26

标签: javascript node.js

正在尝试保存图片。 req.body.image 被定义为 image.png,upload.single 不会发生任何错误,但 req.file 是未定义的。请帮助修复它

app.js:

const express = require("express");
const bodyParser = require("body-parser");
const fs = require("fs");
const path = require("path");
require('dotenv/config');

const models = require("../src/models/models");


const app = express();
const publicDir = path.join(__dirname, "../public");
const viewsDir = path.join(__dirname, "../templates/views");

app.use(express.static(publicDir));
app.use(bodyParser.urlencoded({extended: true}));
app.set("view engine", "hbs");
app.set("views", viewsDir);

app.post('/categories/:id/add', (req, res, next) => {
    let categoryId = req.params.id;
    console.log(req.body.image); // image.png; there is a file
    upload.single('image')(req, res, function (error) {
        if (error) {
            console.log(`upload.single error: ${error}`);
            return res.sendStatus(500);
        }

        console.log(req.file); // undefined
        // ...
    });
    res.redirect("/categories/" + categoryId)
});

app.listen(3000, () => {
    console.log("Server has started")
});

html:

<div class="form-group">
    <label for="id-image">Picture:</label>
    <input type="file" class="form-control-file" name="image" id="id-image">
</div>

1 个答案:

答案 0 :(得分:1)

我想你还没有安装multer来进行上传。您可以按照以下步骤操作:

npm i multer --save // install it 
const express = require("express");
const bodyParser = require("body-parser");
const multer  = require('multer'); // include multer

const upload = multer({ dest: 'provide the path for saving' }) //defined upload

const fs = require("fs");
const path = require("path");
require('dotenv/config');

const models = require("../src/models/models");


const app = express();
const publicDir = path.join(__dirname, "../public");
const viewsDir = path.join(__dirname, "../templates/views");

app.use(express.static(publicDir));
app.use(bodyParser.urlencoded({extended: true}));
app.set("view engine", "hbs");
app.set("views", viewsDir);

app.post('/categories/:id/add', upload.single('image'), (req, res, next) => {

        console.log(req.file); // here you will get file
        // check the path where you are uploading the file
        // ...
    });
    res.redirect("/categories/" + categoryId)
});

app.listen(3000, () => {
    console.log("Server has started")
});

您可以查看更多详情here