node.js 在 node/express + ejs 中将对象传递给客户端？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11151632/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Passing an object to client in node/express + ejs?
提问by Errol Fitzgerald
I have a pretty large object that I need to pass to a function in a client script. I have tried using JSON.stringify, but have run into a few issues with this approach - mostly performance related. Is it possible to do something like this in ejs?
我有一个非常大的对象，我需要将它传递给客户端脚本中的一个函数。我曾尝试使用 JSON.stringify，但在使用这种方法时遇到了一些问题 - 主要与性能有关。有可能在 ejs 中做这样的事情吗？
app.get('/load', function(req, res) {
var data = {
layout:'interview/load',
locals: {
interview: '',
data: someLargeObj
}
};
res.render('load', data);
});
And in my client script, I would pass this object to a function like so
在我的客户端脚本中，我会将这个对象传递给这样的函数
<script type="text/javascript">
load(<%- data %>); // load is a function in a client script
</script>
When I try this I get either
当我尝试这个时，我得到
<script type="text/javascript">
load();
</script>
or
或者
<script type="text/javascript">
load([Object object]);
</script>
采纳答案by Pickels
That is the expected behavior. Your template engine is trying to create a string from your object which leads to [Object object]. If you really want to pass data like that I think you did the correct thing by stringifying the object.
这是预期的行为。您的模板引擎正在尝试从您的对象创建一个指向 [Object object] 的字符串。如果你真的想传递这样的数据，我认为你通过字符串化对象做了正确的事情。
回答by prototype
In Node.js:
在 Node.js 中：
res.render('mytemplate', {data: myobject});
res.render('mytemplate', {data: myobject});
In EJS:
在 EJS 中：
<script type='text/javascript'>
var rows =<%-JSON.stringify(data)%>
</script>
SECURITY NOTE: Don't use this to render an object with user-supplied data. It would be possible for someone like Little Bobby Tablesto include a substring that breaks the JSON string and starts an executable tag or somesuch. For instance, in Node.js this looks pretty innocent...
安全注意事项：不要使用它来渲染具有用户提供数据的对象。像Little Bobby Tables这样的人可能会包含一个子字符串，它会破坏 JSON 字符串并开始一个可执行标记或其他类似的东西。例如，在 Node.js 中，这看起来很无辜……
var data = {"color": client.favorite_color}
but could result in a client-provided script being executed in user's browsers if they enter a color such as:
但如果用户输入以下颜色，则可能会导致在用户浏览器中执行客户端提供的脚本：
"titanium </script><script>alert('pwnd!')</script> oxide"
If you need to include user-provided content, please see https://stackoverflow.com/a/37920555/645715for a better answer using Base64 encoding
如果您需要包含用户提供的内容，请参阅https://stackoverflow.com/a/37920555/645715以获得使用 Base64 编码的更好答案
回答by Piyush Patel
If you are using templating, then it would be much better to get the values in the template, for example whether user is signed in or not. You can get the send local data using
如果您正在使用模板，那么获取模板中的值会更好，例如用户是否登录。您可以使用
<script>
window.user = <%- JSON.stringify(user || null) %>
</script>
From the server side code, you are sending user data.
从服务器端代码，您正在发送用户数据。
res.render('profile', {
user: user.loggedin,
title: "Title of page"
});
回答by btargac
Think there's a much better way when passing an object to the ejs , you dont have to deal with JSON.stringfy and JSON.parse methods, those are a little bit tricky and confusing. Instead you can use the for in loop to travel the keys of your objects, for example:
认为将对象传递给 ejs 时有更好的方法，您不必处理 JSON.stringfy 和 JSON.parse 方法，这些方法有点棘手和令人困惑。相反，您可以使用 for in 循环来移动对象的键，例如：
if you have an object like such hierarchy
如果你有一个像这样的层次结构的对象
{
"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"
}
]
}
}
On the EJS side you can loop yourObject like this;
在 EJS 方面，您可以像这样循环 yourObject；
<% if ( locals.yourObject) { %>
<% for(key in yourObject) { %>
<% if(yourObject.hasOwnProperty(key)) { %>
<div> <a class="pagelist" href="<%= yourObject[key]['subkey'] %>"><%= key %></a></div>
<% } %>
<% } %>
<% } %>
For this example [key] can take 'index','home' and 'about' values and subkey can be any of it's children such as 'url','path_to_layout','path_to_data'
对于此示例，[key] 可以采用 'index'、'home' 和 'about' 值，而子键可以是它的任何子项，例如 'url'、'path_to_layout'、'path_to_data'
回答by Mimigirl
What you have is a result like this [{'re': 'tg'}]
你得到的是这样的结果 [{'re': 'tg'}]
You actually need to loop it. See javascript while loop https://www.w3schools.com/js/js_loop_while.asp
你实际上需要循环它。参见 javascript while 循环 https://www.w3schools.com/js/js_loop_while.asp
Then, render it in your front end with ejs... i can't help on that, i use hbs
然后，用 ejs 在你的前端渲染它......我无能为力，我使用 hbs
