如何發佈從前端的圖像信息通過AJAX到後端

前端JS：如何發佈從前端的圖像信息通過AJAX到後端

 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) {...

後端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數據庫中，並且可以顯示它。

來源

2017-03-01 Steveeeeee

我相信你正在尋找使用Javascript的File Reader。 Here是一些關於如何使用readAsDataURL的優秀文檔，它允許您與文件的字節數組進行交互並將其作爲blob或字節數組提交到數據庫中。

來源

2017-03-01 01:07:12

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) {

來源

2017-03-01 22:11:10 Steveeeeee

如何發佈從前端的圖像信息通過AJAX到後端

回答

相關問題