node.js - tutorial - module ejs node

Pasando un objeto al cliente en node/express+ejs?

Question

Tengo un objeto bastante grande que necesito pasar a una función en un script de cliente. He intentado usar JSON.stringify, pero me he encontrado con algunos problemas con este enfoque, en su mayoría relacionados con el rendimiento. ¿Es posible hacer algo como esto en ejs?

app.get(''/load'', function(req, res) {
var data = {
layout:''interview/load'',
locals: {
interview: '''',
data: someLargeObj
}
};
res.render(''load'', data);
});

Y en mi script de cliente, pasaría este objeto a una función como esa

<script type="text/javascript">
load(<%- data %>); // load is a function in a client script
</script>

Cuando intento esto me sale bien

<script type="text/javascript">
load();
</script>

o

<script type="text/javascript">
load([Object object]);
</script>

Answer 1

Creo que hay una manera mucho mejor de pasar un objeto a los ejs, no tienes que lidiar con los métodos JSON.stringfy y JSON.parse, son un poco complicados y confusos. En su lugar, puede utilizar el bucle for in para viajar por las teclas de sus objetos, por ejemplo:

Si tienes un objeto como este de jerarquía.

{
"index": {
"url": "/",
"path_to_layout": "views/index.ejs",
"path_to_data": [
"data/global.json",
{
"data/meta.json": "default"
}
]
},
"home": {
"url": "/home",
"path_to_layout": "views/home/index.ejs",
"path_to_data": [
"data/global.json",
{
"data/meta.json": "home"
}
]
},
"about": {
"url": "/about",
"path_to_layout": "views/default.ejs",
"path_to_data": [
"data/global.json",
{
"data/meta.json": "about"
}
]
}
}

En el lado de EJS puedes hacer un loop de tu objeto como este;

<% if ( locals.yourObject) { %>
<% for(key in yourObject) { %>
<% if(yourObject.hasOwnProperty(key)) { %>
<div> <a class="pagelist" href="<%= yourObject[key][''subkey''] %>"><%= key %></a></div>
<% } %>
<% } %>
<% } %>

Para este ejemplo, [clave] puede tomar los valores ''índice'', ''inicio'' y ''sobre'' y la subclave puede ser cualquiera de sus hijos, como ''url'', ''path_to_layout'', ''path_to_data''

Answer 2

En Node.js:

res.render(''mytemplate'', {data: myobject});

En EJS:

<script type=''text/javascript''>
var rows =<%-JSON.stringify(data)%>
</script>

NOTA DE SEGURIDAD : No use esto para representar un objeto con datos proporcionados por el usuario. Sería posible que alguien como Little Bobby Tables incluya una subcadena que rompa la cadena JSON e inicie una etiqueta ejecutable o algo así. Por ejemplo, en Node.js esto parece bastante inocente ...

var data = {"color": client.favorite_color}

pero podría resultar en que un script proporcionado por el cliente se ejecute en los navegadores de los usuarios si ingresan un color como:

"titanium </script><script>alert(''pwnd!'')</script> oxide"

Si necesita incluir contenido proporcionado por el usuario, consulte https://.com/a/37920555/645715 para obtener una mejor respuesta utilizando la codificación Base64

Answer 3

Ese es el comportamiento esperado. El motor de su plantilla está intentando crear una cadena desde su objeto que conduce a [Objeto de objeto]. Si realmente quieres pasar datos como esos, creo que hiciste lo correcto al encadenar el objeto.

Answer 4

Lo que tienes es un resultado como este [{''re'': ''tg''}]

En realidad, necesitas hacer un bucle. Ver javascript while loop https://www.w3schools.com/js/js_loop_while.asp

Luego, procesalo en tu parte frontal con ejs ... no puedo ayudar en eso, uso hbs

Answer 5

Si está usando plantillas, entonces sería mucho mejor obtener los valores en la plantilla, por ejemplo, si el usuario ha iniciado sesión o no. Puede obtener el envío de datos locales usando

<script>
window.user = <%- JSON.stringify(user || null) %>
</script>

Desde el código del lado del servidor, está enviando datos de usuario.

res.render(''profile'', {
user: user.loggedin,
title: "Title of page"
});