如何使用强大的表格将文件上传到表格中的MongoDb以及其他数据?

时间:2017-11-16 09:15:33

标签: jquery node.js mongodb

我正在尝试将form data保存到MongoDb,其中还包含image file upload。我使用Jquery form serialize将此数据发送到server。其余数据将保存到数据库,但不会保存到图像中。我想这需要一些特殊的待遇。我怎样才能做到这一点?注意:我希望能够将其与所有表单数据一起发送

这是我的HTML部分:

<!-- SIGNUP for USERS and ADMIN -->
    <div id="pageSignup" class="page popup">
        <div class="wrapper">
            <h3>SIGNUP</h3>
            <form class="form" id="frmSignup">
                <input type="text" id="txtEmailorPhoneNumber" name="txtEmailorPhoneNumber" placeholder="Mobile number or Email" required>
                <input type="text" name="txtName" placeholder="Name" required>
                <input type="text" name="txtLastName" placeholder="Lastname" required>
                <input type="password" name="txtPassword" placeholder="Password" required>
                <div class="lblFileUpload">
                    <p>Select your picture:</p>
                    <input type="file" name="fileUserImage" required>
                </div>
                <button type="button" class="btnShowPage btnForm" id="btnSignupForm">Signup</button>
                <div class="lblFormExtention">
                    <p class="pyesAccount">Already have an account?</p>
                    <button type="button" class="btnShowPage" id="btnLogin" data-showThisPage="pageLogin">Login</button>
                </div>
            </form>
            <h3 class="lblErrorMessage" id="lblSignupErrorMessage"></h3>
        </div>
    </div>

这是jquery序列化部分:

$('#btnSignupForm').click(function () {
        console.log('btn signup user clicked')
        var oForm = $("#frmSignup").serialize()
        console.log("oForm", oForm)
        var sUrl = 'save-user/'
        console.log("sUrl ", sUrl);
        $.post(sUrl, oForm, function (uData) {
            console.log('SUCCESS')
        })
    })

这是我的server.js:

var express = require('express')
var app = express()
var formidable = require('express-formidable');
app.use(formidable());
app.use(express.static(__dirname + '/public'));
var fs = require('fs')
var mongo = require('mongodb').MongoClient
global.db = null
var sDatabasePath = 'mongodb://localhost:27017/webshop'
global.mongoId = require('mongodb').ObjectID

/**************************************************/

var user = require(__dirname + '/user.js')

/**************************************************/

app.get('/shopaholic', (req, res) => { res.sendFile(__dirname + '/shopaholic.html') })

mongo.connect(sDatabasePath, (err, db) => {
    if (err) {
        console.log('ERROR 003 -> Cannot connect to the database')
        return false
    }
    global.db = db
    console.log('OK 002 -> Connected to the database')
    return true
})

/**************************************************/

app.post('/save-user', (req, res) => {
    //var sName = req.fields.userName 
    //console.log("sName ", sName) 
    user.saveUser(req.fields, (err, jResult) => {
        if (err) {
            console.log(jResult)
            res.send('ERROR')
            return
        }
        console.log(jResult)
        res.send('OK')
        return
    })
})

/**************************************************/

app.listen(3000, (err) => {
    if (err) {
        console.log('ERROR 001 -> Cannot listen to port 3000')
        return false
    }
    console.log('OK 000 -> Server listening to port 3000')
})

最后是我的user.js:

var user = {}

/**************************************************/

user.saveUser = (jUserData, fcallback) => {
    var jUser = { "userName": jUserData.txtEmailorPhoneNumber, "firstName": jUserData.txtName, "lastName": jUserData.txtLastName, "password": jUserData.txtPassword, "image": jUserData.fileUserImage }
    global.db.collection('users').insertOne(jUser, (err, jResult) => {
        if (err) {
            var jError = { "status": "error", "message": "ERROR -> user.js -> 001" }
            console.log(jError)
            return fcallback(true, jError)

        }
        var jOk = { "status": "ok", "message": "user.js -> saved -> 000" }
        console.log(jOk)
        return fcallback(false, jOk)
    })
}


/**************************************************/

module.exports = user

1 个答案:

答案 0 :(得分:0)

我建议您使用 multer 模块处理文件上传,并仅在您的mongodb数据库中保存图片的路径/网址,并告诉我们是否已知道你遇到这种方法的任何问题。我很乐意提供帮助。