渲染数据发送到Express post路由器

时间:2017-01-20 03:52:12

标签: javascript jquery node.js express

我从Express开始,我有一个问题;我有设置和所有内容,我已经做了一些简单的事情,但知道我想要与API进行交互,做我想要做的事情我需要我希望得到的数据来自一个input字段。我想使用发送的数据刷新主(/)页面。就像客户端的ajax请求一样。我不知道如何将发送到后路由器的数据发送到获取路由器而不必转到另一个链接(即localhost:3000 / link),我想留在请求的同一页面已经完成。我在模板中使用了pug(jade)

快递:

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', (req, res, next) => {
    res.render('index');
});

/* POST HANDLER */
router.post('/link', function(req, res, next) {
    console.log(req.body);
});

module.exports = router;

jQuery:

$('#shortLink').on('click', () => {
    $.ajax({
        type: 'POST',
        url: '/link',
        data: $('linkInput').val()
    });
});

所以,要明确。用户在输入字段上输入内容;将该数据发送到后路由器,我希望将发送到后路由器的信息发送到获取路由器,而不必离开请求完成的页面。如果我没有很好地解释自己,请告诉我。

1 个答案:

答案 0 :(得分:0)

我们只是说你已经设置了body parser,并了解模板是如何工作的。

在这里你想要的是以某种方式将数据保存在服务器上的某个地方。现在,在一个非常简单的情况下,您可以将其保存到变量:

var data = null;
router.get('/', (req, res, next) => {
    res.render('index', { data: null });
});

router.post('/link', function(req, res, next) {
    data = req.body
    res.send('');
});

然后在您的模板中,您可以执行p= data

现在,post发送到/link后,下一次刷新/将显示数据。

在大多数Web应用程序中,人们会将这些内容保存到数据库中。这里an example for MongoDB将数据保存到特定文档:

router.get('/', (req, res, next) => {
    collection.findOne({ id: 'specificDoc'}, function (err, result) {
        if (err) {
            next(err);
            return;
        }
        res.render('index', { data: result.data });
    });
});

router.post('/link', function(req, res, next) {
    collection.update({ id: 'specificDoc', { data: req.data }, { upsert: true }, function (err, result) {
        if (err) {
            next(err);
            return;
        }
        res.send('');
    });
});

您可能也可能开始使用会话并根据用户使用cookie或其他方法保存数据。 Here's a toturial用于在快递中使用会话。