表單處理

get方法

app.get('/login',function (req,res) {
    console.log(req.query.account);
    console.log(req.query.password);
    ......
    //存入數據庫
    ......
    //從定向頁面
    res.send();
});
  • 需注意的是該方法會重新定向頁面,可返回一HTML頁面提示用戶成功或失敗,不過該方法會在用戶刷新頁面時發出警告,且影響到回退按鈕與歷史記錄,因此不推薦使用。
  • 我們知道的是get方法傳送數據是是將數據保存在請求頭中,直接跟在URL之后,因此長度有限制,一般不能超過1024B,所以一般不使用該方法發送表單數據。

post方法

  • 我們知道的是post方法將數據存儲在請求體(body)中,我們無法直接讀取該數據,因此我們需引入一個中間件 body-parser,
    npm install --save body-paser
    并于使用post方法之前引入
app.use(require('body-parser')());
app.post('/login', function (req, res) {
        console.log(req.body.account);
        console.log(req.body.password);
        ......
        //存入數據庫
        ......
        //從定向頁面
        res.send();
})
  • 需注意的是該方法也會重新定向頁面,可返回一HTML頁面提示用戶成功或失敗,不過該方法會在用戶刷新頁面時發出警告,且影響到回退按鈕與歷史記錄,因此不推薦使用。

使用Ajax方法異步發送表單數據(常用)

  • 該方法與上面提到的兩種在接收數據上完全一樣,在服務端只是添加一判斷保證數據是以Ajax方法發送過來的
app.use(require('body-parser')());
app.post('/login', function (req, res) {
    if (req.xhr || req.accepts('json,html') == 'json') {
        console.log(req.body.account);
        console.log(req.body.password);
        res.send({type: 'login', status: 'scuess'});
    }
    else {
        res.send({type: 'login', status: 'error'});
    }
});
  • 該方法由于其異步的性質不會重載前端頁面,比較常用。

HTML表單文件上傳

  • 上傳時需設置表單屬性enctype="multipart/form-data"
    <form action="http://127.0.0.1:3000" class="col-md-4 col-md-offset-4" enctype="multipart/form-data" method="post">
        <div class="form-group">
            <label for="file" class="control-label">上傳文件</label>
            <input type="file" name="file" id="file">
        </div>
        <div class="form-group">
            <input type="submit" name="submit" class="btn btn-default btn-block">
        </div>
    </form>
var formidable = require('formidable');
app.post('/', function (req, res) {
    var formdata = new formidable.IncomingForm();
    formdata.parse(req, function (err, filed, files) {
        console.log(files);
    });
});

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容