Javascript res.render（）和#x27；s目标_Javascript_Extjs_Node.js_Ejs

Javascript res.render（）和#x27；s目标

javascript extjs node.js

Javascript res.render（）和#x27；s目标,javascript,extjs,node.js,ejs,Javascript,Extjs,Node.js,Ejs,我试图让客户端javascript能够访问一个变量（最终由从数据库中选择的更复杂的json替换）。我希望在呈现页面时加载它，而不是ajax调用，并且它不会通过像ejs这样的模板呈现（我希望将数据传递到combobox的extjs存储）。因此，我有一个标准的回应： function (req, res) { res.render('index.html', {foo: ['a','b']}); } 还有一个空白的html页面，我想访问foo: <!DOCTYPE html> &l

我试图让客户端javascript能够访问一个变量（最终由从数据库中选择的更复杂的json替换）。我希望在呈现页面时加载它，而不是ajax调用，并且它不会通过像ejs这样的模板呈现（我希望将数据传递到combobox的extjs存储）。因此，我有一个标准的回应：

function (req, res) {
  res.render('index.html', {foo: ['a','b']});
}

还有一个空白的html页面，我想访问foo:

<!DOCTYPE html>
<html>
<head>
<script type=text/javascript>
console.log(foo);
</script>
</head>
<body>
</body>
</html>


console.log（foo）；

有什么想法吗？我曾经考虑过也许可以通过res.send（）编写整个html页面（它比上面的例子有更多的东西），但这似乎是一个解决办法，可以很明显地完成一些事情…

在EJS中，下面应该可以工作

<script type=text/javascript>
  console.log( <%= foo %>);
</script>


log（）；

我建议不要动态生成JavaScript，因为它打破了关注点的分离，并强制启用JavaScript

编辑：

事实证明，上述方法对阵列不起作用。因此，只需用语义HTML对数据进行编码。然后用JavaScript增强它。如果JavaScript必须获取数据，那么将其存储在更合理的位置，比如cookie，或者通过ajax检索数据。

假设您在上面的问题中使用相同的数组

foo

，这里有几种方法可以做到这一点

这一个使用EJS筛选器编写数组文本：

<script type="text/javascript">
var foo = ['<%=: foo | join:"', '" %>'];
</script>


变量foo=['']；

此代码将其编码为JSON，稍后由客户端javascript解析：

<script type="text/javascript">
// note the "-" instead of "=" on the opening tag; it avoids escaping HTML entities
var fooJSON = '<%-JSON.stringify(foo)%>';
</script>


//注意开头标记上的“-”而不是“=”；它避免了转义HTML实体
var fooJSON=''；

IIRC，ExtJS可以直接处理JSON作为其数据。如果没有，那么您可以先使用它的JSON解析器，然后给它一个局部变量。如果您没有使用ExtJS，您可以使用它在客户端上解析：

如果您选择将其编码为JSON，那么以后也可以更容易地切换回AJAX来检索数据。在某些情况下，这将具有优势。页面可以加载和显示一些数据，并在正在加载数据的元素上显示一个忙图标

这并不是说在原始请求中包含所有数据本身就有什么问题。只是坚持使用JSON让您以后可以灵活选择。

如果禁用JavaScript怎么办？用HTML编码服务器端信息。该应用程序使用Sencha Touch（需要webkit）。它最终将使用phonegap并进入android和苹果市场，因此，如果该应用的覆盖范围很广（例如yahoo.com不愿意错过2%不使用javascript的用户），那么这将是一个非常糟糕的主意，但该应用的目标受众更为具体。@Qoolot这与用户%无关。这是关于关注点的分离。你所做的只是不好的实践。好的，谢谢，我绝对不想固执地使用错误的工具将变量“强制”到客户端javascript中（ejs似乎是用于html模板的）。最终的问题是如何从节点服务器向客户端获取json，而不必加载页面，然后让它向服务器进行ajax调用？PHP向页面中注入一些JSON供客户端javascript使用似乎是一件小事，但我正在努力找到一个节点示例（我看到通过ajax调用、套接字推送数据，通过RESTful API返回JSON等）。@Qoolot PHP教给你一些坏做法（将JSON注入页面）。使用语义HTML并获取静态javascript文件来增强HTML页面。如果您真的需要加载更多数据，请使用ajax与REST web服务通信。问题是，如果我像上面那样定义“foo”，那么我会返回：“a，b”的格式与我设置的字符串数组（文本周围缺少引号）不同。您为什么不建议动态生成javascript？如果应用程序是ExtJS，那么应用程序在没有javascript的情况下也不会运行。@BlackTiger，因为动态生成的javascript导致了我们在PHP3/ASP时代的标签汤。使用静态打包、缩小、捆绑和压缩的javascript。视图/模板应该只负责动态生成的HTML。（CSS也应该是静态的）当然，但是您可能会有一个页面，该页面必须加载大量数据库信息，执行多个ajax请求，从而使页面加载速度大大降低。我想和其他任何东西一样，你必须根据你的具体用途权衡利弊。是的，你可以。但这只是糟糕设计的副作用。如果您采用渐进式增强和不引人注目的JavaScript技术，那么情况就不是这样了。