Question

前端js：

        var newUser = {
        'username': $('#addUser fieldset input#inputUserName').val(),
        'email': $('#addUser fieldset input#inputUserEmail').val(),
        'fullname': $('#addUser fieldset input#inputUserFullname').val(),
        'age': $('#addUser fieldset input#inputUserAge').val(),
        'sex': $('input:radio[name="sex"]:checked').val(),
        'profileimage':$('input[name="profileimage"]').val()
    }
    console.log($('input[name="sex"]').val());
    // use AJAX to post object to adduser service
    $.ajax({
        type: 'POST',
        data: newUser,
        url: '/users/adduser',
        dataType: 'JSON'
    }).done(function (response) {...

Back End js（使用express.js和multer）

router.post('/adduser', upload.single('profileimage'), function (req, res) {
var db = req.db;
var collection = db.get('userlist');

var username = req.body.username;
var email = req.body.email;
var age = req.body.age;
var sex = req.body.sex;
var fullname = req.body.fullname;

if (req.file) {
    var profileimage = req.file.filename;
} else {
    var profileimage = 'noimage.jpg';
}

collection.insert({
    "username": username,
    "email": email,
    "age": age,
    "sex": sex,
    "fullname": fullname,
    "profileimage": profileimage
}, function (err, result)...

上面的代码不起作用。我应该怎么做将图像信息插入我的mongoDB数据库，并且也可以显示它。

Answer 1

我相信您正在寻找Javascript中的File Reader。 Here是一些关于如何使用readAsDataURL的优秀文档，它允许您与文件的字节数组进行交互，并将其作为blob或字节数组提交到数据库中。

Answer 2

Formdata可以帮助解决这个问题，解决了问题。

        var newUser = new FormData();
    newUser.append('username', $('#addUser fieldset input#inputUserName').val());
    newUser.append('email', $('#addUser fieldset input#inputUserEmail').val());
    newUser.append('fullname', $('#addUser fieldset input#inputUserFullname').val());
    newUser.append('age', $('#addUser fieldset input#inputUserAge').val());
    newUser.append('sex', $('input:radio[name="sex"]:checked').val());
    newUser.append('profileimage', $('#uploadImage')[0].files[0]);

    console.log($('input:radio[name="sex"]:checked').val());
    //console.log(newUser);
    // use AJAX to post object to adduser service
    $.ajax({
        type: 'POST',
        data: newUser,
        url: '/users/adduser',
        dataType: 'JSON',
        contentType: false,
        processData: false
    }).done(function (response) {

如何通过ajax从前端到后端发布图像信息

2 个答案: