javascript - 使用 multer 传递 memoryStorage 以用 ajax 表达,但 req.file 未定义

标签 javascript node.js ajax express file-upload

我知道 stackoverflow 中有很多帖子询问 req.file is not defined,我浏览了很多,其中大部分都是命名,我不认为这是我如何变得 undefined虽然。

这是我的 html (哈巴狗) 我没有使用表单,因为我只是在更改时使用输入

                    input#avatar-file(type='file', name='avatar')
                    button#add-avatar-btn.btn.btn-info Add Avatar

我的 Ajax

s = {
    onClick: () => {
        $('#add-avatar-btn').on('click', function (e) {
            e.preventDefault();
            $('#avatar-file').click();
        });
    },
    onChange: () => {
        $('#avatar-file').on('change', function (e) {
            e.stopPropagation();
            e.preventDefault();

            let file = e.target.files;
            if (file.length === 1) {
                let formData = new FormData();
                formData.append('avatar', file);
                console.log(formData, 'formdata');  // this gives me -> FormData {} "formdata"
                s.runAjax(formData);
            }
        });
    },
    runAjax: dataValue => {
        $.ajax({
            method: 'post',
            url: '/avatar/upload',
            data: dataValue,
            contentType: false,
            processData: false,
            success: data => {
                console.log(data, 'data success return');
            },
            error: err => {
                console.log(err, 'err return ');
            }
        });
    },
};

s.onClick();
s.onChange();

我的 express 部分

const multer  = require('multer');
const storage = multer.memoryStorage();
const upload = multer({ storage: storage });

router.post('/avatar/upload',  upload.single('avatar'), async (req, res, next) => {
    try {

        console.log(req.body.avatar, 'req.body.avatar');  // { avatarUrl: '[object FileList]' } 'req.body'
        console.log(req.files, 'request files');  // undefined
        console.log(req.file, 'single file');  // undefined
        return res.json({status: true});
    } catch (err) {
        return next(err);
    }
});

我做错了哪一部分? 我实际上是在尝试使用内存存储,因此它存储为缓冲区,然后将其上传到 s3,而不是在本地保存图像。

但我被困在这里。

在此先感谢您的帮助。

最佳答案

它不起作用,因为您发送的是数组而不是文件。

formData.append('avatar', file[0]);

代替

formData.append('avatar', file);

关于javascript - 使用 multer 传递 memoryStorage 以用 ajax 表达,但 req.file 未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52462933/

相关文章:

javascript - TypeScript 'number' 不可分配给 0 | 10 | 20 即使数字为 0

javascript - Mongoose 在坐标上抛出错误值

PHP、JQuery ajax 不工作

javascript - JS 中具有默认属性和类类型对象的数据结构是什么?

jQuery,同时 ajax 调用和 $.when

javascript - Codeigniter ajax 检查电子邮件可用性

javascript - 在 Laravel 5 中通过 URL 传递数据集?

javascript - 欧元格式剑道网格列 Angular JS

javascript - 动态分配事件监听器

arrays - 如何增加数组mongodb下重复值的计数器