使用MulterStorageCloudinary從同一表單上傳音頻和影像

我必須創建一個使用 Multer Storage Cloudinary 將 1 個音頻檔案和 1 個影像（調整大小）上傳到 Cloudinary 的路由，并將 URL 和名稱保存在我的 mongo 資料庫中。當我嘗試上傳音頻檔案時，我收到錯誤“無效的影像檔案”（即使我transformation在allowedFormats.

云代碼：

const cloudinary = require('cloudinary').v2;
const { CloudinaryStorage } = require('multer-storage-cloudinary');

cloudinary.config({
    cloud_name: process.env.CLOUDINARY_CLOUD_NAME,
    api_key: process.env.CLOUDINARY_KEY,
    api_secret: process.env.CLOUDINARY_SECRET
});

const storage = new CloudinaryStorage({
    cloudinary,
    params: {
        folder: 'nono',
        // transformation: [
        //     {width: 500, height: 500, crop: "fill"}
        // // ],
        // allowedFormats: ['jpeg', 'png', 'jpg', 'mp3']
    }
});

module.exports = { cloudinary, storage }

路線代碼：

router.route("/")
    .get(catchAsync(sounds.index));
    .post(isLoggedIn, upload.fields([{ name: 'sound[audio]', maxCount: 1 }, { name: 'sound[image]', maxCount: 1 }]), joiValidationSounds, catchAsync(sounds.newSound));

module.exports.newSound = async (req, res) => {
    const sound = new Sound(req.body.sound);
    console.log(req.files)
    sound.image.url = req.files["sound[image]"][0].path;
    sound.image.filename = req.files["sound[image]"][0].filename;
    sound.audio.url = req.files["sound[audio]"][0].path;
    sound.audio.filename = req.files["sound[audio]"][0].filename;
    sound.author = req.user._id;
    await sound.save();
    req.flash("success", "Se ha a?adido un nuevo sonido.");
    res.redirect(`/sounds/categories/:category/${sound._id}`);
}

表格代碼：

<form action="/sounds" method="POST" novalidate class="validated-form" enctype="multipart/form-data">
        <div class="row mb-3">
            <label for="audio" class="col-sm-2 col-form-label">Audio:</label>
            <div class="col-sm-10">
                <input type="file" name="sound[audio]" id="audio">
            </div>
        </div>
        
        <div class="row mb-3">
            <label for="image" class="col-sm-2 col-form-label">Imagen:</label>
            <div class="col-sm-10">
                <input type="file" name="sound[image]" id="image">
            </div>
        </div>

        <button type="submit" class="btn btn-success">Crear</button>
        <button type="reset" class="btn btn-success">Limpiar</button>
    </form>

我可以毫無問題地上傳 2 張圖片。我還檢查了 Cloudinary 是否支持 mp3 檔案。

編輯：我設法用resource_type: 'video', allowedFormats: ['mp3'],兩個不同的存盤上傳音頻。但是現在當我嘗試上傳兩者時，我收到錯誤“意外欄位”。

新代碼：

const storageAudio = new CloudinaryStorage({
    cloudinary: cloudinary,
    params: {
        folder: 'nono',
        format: 'mp3',
        resource_type: 'video',
        allowedFormats: ['mp3'],
    }
});

const storageImage = new CloudinaryStorage({
    cloudinary: cloudinary,
    params: {
        folder: 'nono',
        transformation: [
            {width: 500, height: 500, crop: "fill"}
        ],
        format: 'jpg',
        resource_type: 'image',
        allowedFormats: ['jpeg', 'png', 'jpg']
    }
});

module.exports = { cloudinary, storageImage, storageAudio };

const multer = require("multer");
const { storageImage, storageAudio  } = require("../cloudinary");
const uploadAudio = multer({ storage: storageAudio });
const uploadImage = multer({ storage: storageImage });

router.route("/")
    .get(catchAsync(sounds.index))
    .post(isLoggedIn, 
        // uploadAudio.fields([{ name: 'sound[audio]', maxCount: 1 }]), uploadImage.fields([{ name: 'sound[image]', maxCount: 1 }]),
        uploadAudio.single("sound[audio]"), 
        uploadImage.single("sound[image]"),
        // upload.fields([{ name: 'sound[audio]', maxCount: 1 }, { name: 'sound[image]', maxCount: 1 }]), 
    joiValidationSounds, catchAsync(sounds.newSound)
    );

uj5u.com熱心網友回復：

上傳檔案到 Cloudinary 時，上傳引數之一是resource_type，告訴 Cloudinary 如何處理傳入的檔案。可能的值是“影像”、“視頻”、“原始”（非影像、非視頻）或“自動”（上傳后將打開檔案以檢查型別）

如果您在Invalid image file上傳視頻時遇到錯誤，很可能意味著上傳呼叫中的 resource_type 設定為“影像”，并查看您正在使用的插件的存盤庫，情況似乎是這樣：https://github.com/affanshahid/multer-storage-cloudinary/issues/13

您可能需要聯系插件維護者，看看他們是否可以允許在未來版本中覆寫資源型別，或者派生插件以允許在配置中覆寫資源型別

或者，您可以直接使用 Cloudinary 的 SDK 來執行上傳，并multer僅用于使上傳的檔案可用于您的代碼。在這種情況下，Cloudinary SDK 在上傳時默認使用 resource_type "auto"，如果需要，您可以在自己的代碼中覆寫該值

uj5u.com熱心網友回復：

最后，我找到了一種同時上傳影像和音頻的解決方案（一個存盤和一個表單）：

1）將引數設定為您將上傳的所有格式 resource_type: 'auto',。allowedFormats

const storage = new CloudinaryStorage({
    cloudinary,
    params: {
        folder: 'nono',
        resource_type: 'auto',
        allowedFormats: ['jpeg', 'png', 'jpg', 'mp3'],
        transformation: [
            {width: 500, height: 500, crop: "fill"}
        ]
    }
});

2)使用 upload.fields

upload.fields([{ name: 'sound[audio]', maxCount: 1 }, { name: 'sound[image]', maxCount: 1 }]), 

標籤：

上一篇：在mongodb中匯總每小時每周每月每年資料

下一篇：字典串列的串列理解