試圖弄清楚如何從客戶端到服務器端使用表單，以及如何反向使用mongodb，node和html？

Question

我是這里的初學者。 我目前正在使用twitter引導程序（html，css，js），用於服務器端的node.js，用於非SQL數據庫的mongodb。 我一直在看一堆東西，並且正在尋找答案或任何方向，以了解如何在HTML端填寫表格（即用戶帳戶注冊）（已經完成此操作）

<code> 
<form class="validateForm" id="registerform" method="POST" action=""  accept-charset='UTF-8'>
    <fieldset>
        <legend>Register</legend> <br>
            <input type="text" name="firstName" id="firstName" placeholder="First Name"     maxlength="20" value=""/> <br>
            <input type="text" name="lastName" id="lastName" placeholder="Last Name" maxlength="20" value=""/> <br>
            <input type="text" name="email" id="email" placeholder="Email" maxlength="30" value=""/> <br>
            <input type="password" name="password" id="password" placeholder="Password" value=""/> <br>
            <input type="password" name="confirmPassword" id="confirmPassword"placeholder="Confirm Password" value=""/> <br>
            <input type="text" name="phoneNumber" id="phoneNumber" placeholder="Phone Number" maxlength="10" value=""/> <br>
            <input type="date" name="birthday" id="birthday" placeholder="Birthday" value=""/>    
            <br>
            <label id="legalConfirm" for="agree"><input type="hidden" name="agree" value="0"  />
            <input type="checkbox" name="agree" id="agree" value="1" checked="checked" /> By clicking join you confirm that you accept our <a href="/privacy.html">Privacy Policy</a> and <a href="/terms.html">Terms of Service</a>.</label>
                <input class="btn btn-primary" type="submit" name="create" value="Join"/>
                <a href="/"><button type="button" class="btn">Cancel</button></a>
            </fieldset>
        </form>

那是我使用twitter bootstrap並在js端對其進行驗證的表單。 但是，不確定要采取什么行動。

該頁面由node.js通過我的路由器提供。

<code>
exports.signUp = function(req, res){
  res.render('signUp');
};

那位於路由文件夾中，在我的server.js文件中被稱為require（'./ routes / home.js）。

我在package.json文件中將貓鼬作為依賴項，並試圖找到有關它的更多文檔，這非常令人困惑。

我的視圖引擎使用的是html（不是jade或ejs），盡管我願意使用它們，但它們很容易理解。

我直接從計算機上運行mongo，但一直在研究mongohq，以使事情變得容易一些。

基本上，如果有人可以幫助或指導我如何完成表單，以便可以將信息放入（POST）mongo的db中，然后退出mongo（GET）並作為用戶個人資料放到頁面上。

我可能需要澄清的另一件事是如何獲取它以顯示在新頁面上，例如“我的資料頁面”（我是否必須創建模板/頁面，或者如何鏈接為創建帳戶而保存的信息）到“我的個人資料”頁面）。

使用HTML，JS（jQuery，JSON），Node.Js和Mongodb進行從客戶端到服務器端的整個表單過程的指南，包括POST（表單）和GET（到新頁面）。

---

更新

所以在這里我已經為POST嘗試過了，所以現在可以使用了，但是卻找不到html模塊錯誤。

這是我的server.js文件的代碼。

<code>
  var express = require('express')
  , home = require('./routes/home.js')
  , path = require('path')
  , http = require('http')
  , mongoose = require('mongoose');

 mongoose.connect('mongodb://localhost/test');


app.post('/signUp', home.signUpUser);

----現在這是我的home.js（又稱路由器js文件）

<code>
var mongoose = require('mongoose');

var conn = mongoose.connection;
exports.index = function(req, res){
  res.render('index');
};

exports.signUp = function(req, res){
  res.render('signUp');
};

exports.about = function(req, res) {
    res.render('about');
};


exports.signUpUser = function (req, res, next) {
if (req.body && req.body.email && req.body.password === req.body.confirmPassword) {
    var obj = {
        firstName: req.body.firstName || 'na',
        lastName: req.body.lastName || 'na',
        email: req.body.email,
        password: req.body.password,
        phone: req.body.phoneNumber || '555-555-555',
        birthday: new Date(req.body.birthday) || new Date()
    };
    conn.collection('users').insert(obj, function (err) {
        if (!err) {
            res.redirect('/about.html');
        } else {
            next(err);
        }
    });
} else {
    next(new Error('Incorrect POST'));
}
};

Answer 1

在您的表單中，“ action”是應發出請求的網址，例如action="/signup" 。

我假設您在示例中使用express（來自res.render調用）。

使用express時，您需要使用以下命令將bodyParser中間件添加到中間件app.use(express.bodyParser()); ： app.use(express.bodyParser());

在此之后，您需要發布的路線： app.post('/signup', routes.postedSignup);

routes.postedSignup可能類似於以下內容：

exports.postedSignup = function (req, res, next) {
    if (req.body && req.body.email && req.body.password === req.body.confirmPassword) {
        var obj = {
            firstName: req.body.firstName || 'na',
            lastName: req.body.lastName || 'na',
            email: req.body.email,
            password: bcrypt.hashSync(req.body.password, 8),
            phone: req.body.phoneNumber || '555-555-555',
            birthday: new Date(req.body.birthday) || new Date()
        };
        db.userCollection.insert(obj, function (err) {
            if (!err) {
                res.redirect('/login');
            } else {
                next(err);
            }
        });
    } else {
        next(new Error('Incorrect POST'));
    }
};

在這里db應該是您的數據庫驅動程序， bcrypt是bcrypt模塊，用於使用隨機鹽對密碼進行哈希處理。

要從數據庫中獲取此數據，您需要為其創建一條路由： app.get('/profile/:email', routes.getProfile);

然后，此路由將類似於以下內容（假設用戶已登錄並且存在有效會話，並且用戶數據另存為req.session.user ）：

exports.getProfile = function (req, res, next) {
    if (req.session.user && req.session.user.email === req.params.email || req.session.user.admin) {
        db.userCollection.findOne({ email: req.params.email }, function (err, result) {
            if (!err && result) {
                res.locals.user = result;
                res.render('userprofile');
            } else {
                var errorMessage = err || new Error('no user found');
                next(errorMessage);
            }
        });
    } else {
        next(new Error('Insufficient permissions'));
    }
};

為了使來自res.locals.user的數據可用，您需要使用某種模板將數據注入到res.render 。 設置為res.locals任何值（或作為對象傳遞到render調用中的值）都可以在模板中使用，在這種情況下，您要訪問的var稱為user 。

next()調用將錯誤傳遞給錯誤處理程序，我假設您在中間件中將它作為最后一個。 如果沒有，您應該在這里閱讀。

您還可以使用客戶端模板來處理這種情況，因此您只從路由返回json，而不渲染任何模板。 為此，您只需將res.render替換為res.json ，並將模板名稱替換為您希望作為json發送的對象。

對於真實世界的應用程序，您必須充實一些內容，例如，檢查是否沒有用戶使用相同的電子郵件等。注冊可以分為幾個不同的功能，以便可以將其他功能重復用於編輯用戶個人資料。

還可以在中間件中包含express.csrf ，以保護用戶免受csrf攻擊。

希望這能幫助您前進。