javascript - 在 ExpressJS 中将变量传递给 JavaScript

Question

我对此完全迷失了；我正在使用 NodeJS 获取 JSON，我需要将变量传递到我的页面并让 JavaScript 使用数据。

app.get('/test', function(req, res) {
    res.render('testPage', {
        myVar: 'My Data'
    });

这是我的 Express 代码(非常简单，用于测试目的)；现在使用 EJS 我想收集我知道要在页面上呈现的数据很简单

<%= myVar %>

但我需要能够在 JavaScript 中收集这些数据(如果可能在 .js 文件中)，但现在只是在我尝试过的警报框中显示变量

在 Jade 中就像 alert('!{myVar}')或 !{JSON.stringify(myVar)} .我可以在 EJS 中做类似的事情吗？我不需要像 <input type=hidden> 这样的任何字段并在 javascript 中获取字段的值。如果有人可以提供帮助，将不胜感激

Answer 1

你可以使用这个(客户端):

<script>
  var myVar = <%- JSON.stringify(myVar) %>;
</script>

您还可以让 EJS 呈现 .js 文件:

app.get('/test.js', function(req, res) {
  res.set('Content-Type', 'application/javascript');
  res.render('testPage', { myVar : ... });
});

但是，模板文件 (testPage) 仍然需要具有 .html 扩展名，否则 EJS 将找不到它(除非您告诉 Express 另有说明)。

正如@ksloan 在评论中指出的那样:您必须小心 myVar 包含的内容。如果它包含用户生成的内容，这可能会使您的网站受到脚本注入(inject)攻击。

防止这种情况发生的可能解决方案:

<script>
  function htmlDecode(input){
    var e = document.createElement('div');
    e.innerHTML = input;
    return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
  }
  var myVar = JSON.parse(htmlDecode("<%= JSON.stringify(myVar) %>"));
</script>