上传视频和图片

Question

请问，我想知道为什么我的 app.js 文件中的第一个和最后一个端点以及其余端点不起作用，尤其是第三个端点。

这些是我的文件：

app.js

const  express = require('express');
const {uploadImage, uploadVideo} = require('./utils/multer');
const bodyParser = require('body-parser');
const path = require('path');

const uploadSingleImageRouter = require('./routes/image/upload/single');
const uploadMultipleImageRouter = require('./routes/image/upload/multiple');
const uploadMultipleVideoRouter = require('./routes/video/upload/multiple');
const retrieveImages = require('./routes/image/retrieve/images');
const app = express();

app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(express.static(path.join(__dirname, 'public')));

app.use(bodyParser.urlencoded({extended: false}));
app.use(bodyParser.json());

//routers

app.use('/api', uploadImage.single('image'), uploadSingleImageRouter, (error, req, res, next) =>{
    res.status(400).send({error: error.message});
});
app.use('/api', uploadImage.array('image', 10), uploadMultipleImageRouter, (error, req, res, next) =>{
    res.status(400).send({error: error.message});
});
app.use('/api', uploadVideo.single('video'), uploadMultipleVideoRouter, (error, req, res, next) =>{
    res.status(400).send({error: error.message});
});
app.use('/api', retrieveImages, (error, req, res, next) =>{
    res.status(400).send({error: error.message});
});

module.exports = app;

multer.js

const multer = require('multer');

//specify the storage engine

const storage = multer.diskStorage({
    destination: function(req, file, cb){
        cb(null, './public/imageUpload')
    },
    filename:function(req, file, cb){
        cb(null, Date.now() + '-' + file.originalname)
    }
});

const storageVideo = multer.diskStorage({
    destination: function(req, file, cb){
        cb(null, './public/videoUpload')
    },
    filename:function(req, file, cb){
        cb(null, Date.now() + '-' + file.originalname)
    }
});

// file validation

const fileFilter = (req, file, cb) => {
    if(file.mimetype === 'image/jpeg' || file.mimetype ===  'image/png'){
        cb(null,true);
    }else{
        cb({message: 'Unsupported File Format'}, false)
    }
};

const fileFilterVideo = (req, file, cb) => {
    if(file.mimetype === 'video/mp4'){
        cb(null,true);
    }else{
        cb({message: 'Unsupported File Format'}, false)
    }
};


const uploadImage = multer({
    storage: storage,
    limits: {fileSize: 4096 * 4096},
    fileFilter: fileFilter
});

const uploadVideo = multer({
    storage: storage,
    fileFilter: fileFilterVideo
});

module.exports = {uploadImage, uploadVideo};

single.js 用于上传单个图像路由器

const express = require('express');
const fs = require('fs');
const router = express.Router();

router.use(express.json());

router.post("/uploadSingleImage", async(req, res)=>{
  res.send(req.file);
});

module.exports = router;

multiple.js 用于上传多张图片

const express = require('express');
const fs = require('fs');
const router = express.Router();

router.use(express.json());

router.post("/uploadImages", async(req, res)=>{
    res.send(req.files);
});

module.exports = router;

multiple.js 用于上传视频

const express = require('express');
const fs = require('fs');
const router = express.Router();

router.use(express.json());

router.post("/uploadVideo", async(req, res)=>{
    res.send(req.file);
});

module.exports = router;

当我在邮递员上向 http://localhost:3000/api/uploadSingleImage 发出发布请求时，结果如下：

{
    "fieldname": "image",
    "originalname": "1330451179-origin.jpg",
    "encoding": "7bit",
    "mimetype": "image/jpeg",
    "destination": "./public/imageUpload",
    "filename": "1652960485144-1330451179-origin.jpg",
    "path": "public\\imageUpload\\1652960485144-1330451179-origin.jpg",
    "size": 180426
}

对于 http://localhost:3000/api/uploadImages 上的 post 请求，当我上传一张图片时，结果如下：

[]

对于两个或更多图像，结果如下：

{
    "error": "Unexpected field"
}

最后，对于 http://localhost:3000/api/uploadVideo 上的 post 请求，结果是：

{
    "error": "Unexpected field"
}

我需要知道为什么对于 http://localhost:3000/api/uploadVideo，它显示意外错误，而对于 http://localhost:3000/api/uploadImages，它显示空数组或意外错误。

如果有人能帮助我，我会很高兴。 谢谢你

Answer 1

您能展示一下客户端的API调用吗？也许您在收集表单上传数据时定位正确的文件时犯了错误。

如果您使用文件，请尝试使用

e.target.files[0]

。

Answer 2

在

uploadVideo

功能中将存储类型更改为

storageVideo

在 multer.js 中使用或修改此函数：

const uploadVideo = multer({
    storage: storageVideo,
    fileFilter: fileFilterVideo
});