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>