Node.js, передающие параметры клиенту с помощью экспресс-рендеринга

Я использую Node.js, и у меня возникают проблемы с общением с клиентом.

Я определяю Express:

var express             = require("express");
var app                 = express();`

Когда я пытаюсь передать параметр клиенту при запросе страницы, переменная не содержит данных, например:

app.get("/", function(req, res){
    res.render("index", { name: "example" });
});

На странице индекса, когда я использую консоль для печати переменной (name), она возвращает "".

Дополнительная информация: http://expressjs.com/api.html#app.render

Мне что-то не хватает или что-то не так?

Ответ 1

Переменная name, отправленная в функцию рендеринга, доступна только при рендеринге страницы после ее отправки клиенту, она недоступна. Вы должны использовать его в своем представлении на этапе рендеринга.

Поскольку вы используете рули, вы можете отобразить его на своей странице, например:

<h1>{{ name }}</h1>

Если вы хотите использовать эти данные в javascript, используйте его внутри тега script:

<script>
  var name = "{{ name }}";
  console.log(name);
</script>

Ответ 2

В основном вы говорите экспресс, чтобы отобразить вашу индексную страницу и предоставить значение для переменной name, но это необязательно делает var name доступным для javascript на стороне клиента. Вам нужно изменить свой индексный шаблон, чтобы отобразить на странице переменную name. Синтаксис варьируется в зависимости от используемого вами механизма шаблонов (jade, ejs, dustjs).

Другим решением является использование ajax-вызова на вашем javascript-странице клиента и использование res.json на сервере вместо этого для отправки данных. Затем вы можете оценить name в консоли. Ex с использованием jquery:

index.html

$.get( "/getvar", function( data ) {
  name = data.name;
});

server.js:

app.get("/getvar", function(req, res){
    res.json({ name: "example" });
});

Ответ 3

Если вы хотите получить параметры на clientide через javascript, вы должны сделать шаблон, подобный этому <script>var data = data</script>, иначе переменные недоступны

Если вы используете Jade, это будет примерно так:

script(type='text/javascript').
    var name = !{name}

Ответ 4

утилизац

<script>
  var name = "<%"= id "%>";
  console.log(name);
</script>

Ответ 5

Передача списка данных из узла js в html

server.js

var http = require('http');
var express = require('express');
var sqlite3 = require('sqlite3').verbose();
var bodyParser = require('body-parser');
var path    = require("path");

console.log('Server running at http://127.0.0.1:8081/');

var __dirname = "D:/html-files";
var app = express();
var urlencodedParser = bodyParser.urlencoded({ extended: false })

var engine = require('consolidate');

app.engine('html', engine.mustache);
app.use(express.static('./'));

app.get('/', function(req, res) {

    res.render('index.html');   

});

app.post('/', function (req, res) {
   console.log("Got a POST request for the homepage");
   res.send('Hello POST');
});

app.post('/get-user-list', urlencodedParser, function (req, res) {

    let db = new sqlite3.Database('user.db', sqlite3.OPEN_READWRITE, (err) => {
        if (err) {
            console.error(err.message);
        }
        console.log('Connected to the user database.');
        console.log("ID" + "\t" + "NAME" + "\t" + "EMAIL");
    });

    db.serialize(() => {     

        var dataList = "";

        db.each('SELECT id, name, email FROM USER ', (err, row) => {
            if (err) {
                console.error(err.message);
            }
            if(dataList != "")
            dataList = dataList + ',';

            dataList = dataList + '{"id":"' + row.ID + '","name":"' + row.NAME + '","email":"' + row.EMAIL + '"}';
            console.log("dataList : " + dataList);
        });

        db.close((err) => {
            if (err) {
                console.error(err.message);
            }
            console.log('Close the database connection.');
            response = {'username':dataList};                           
            aFunction(res, dataList);

        });

    });

});

var aFunction = function(res, dataList) {
    console.log('return to page.');
    console.log("dataList : " + dataList);
    res.render(__dirname + "/list-all-users.html", response);
};

app.listen(8081, '127.0.0.1')