1

我正在尝试使客户端javascript可以访问一个变量（最终被从数据库中选择的更复杂的json替换）。我想在呈现页面而不是 ajax 调用时加载它，并且它不会通过像 ejs 这样的模板呈现（我想将数据传递给组合框的 extjs 存储）。所以我有一个标准的响应：

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

和一个我想访问 foo 的空白 html 页面：

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

有任何想法吗？我考虑过可能通过 res.send() 编写整个 html 页面（它比上面的例子多一些东西），但这似乎是一个应该做的事情的解决方法......

4

2 回答 2

1

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

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

我确实建议不要动态生成 JavaScript，因为它会破坏关注点的分离并强制 JavaScript 开启。

编辑：

事实证明，上述内容不适用于数组。因此，只需将您的数据编码为语义 HTML。然后用 JavaScript增强它。如果 JavaScript 必须获取数据，则将其存储在更合理的位置，例如 cookie 或通过 ajax 检索。

于 2011-06-12T21:43:01.893 回答
1

假设foo您在上面的问题中使用了相同的数组，这里有几种方法可以做到这一点。

这个使用 EJS 过滤器来编写数组文字：

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

这个将其编码为 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>

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

如果您选择将其编码为 JSON，它还可以让以后更容易切换回 AJAX 以检索您的数据。在某些情况下，这将具有优势。该页面可以加载并显示一些数据，以及您正在为其加载数据的元素上方的忙碌图标。

这并不是说将所有数据包含在原始请求中存在任何固有的错误。只是坚持使用 JSON 为您提供了以后选择的灵活性。

于 2011-06-13T03:58:20.723 回答