将变量传递给ExpressJS中的JavaScript

Question

我对此完全迷失了；我正在使用NodeJS来获取JSON，我需要将变量传递给页面并让JavaScript使用数据。app.get('/test', function(req, res) {    res.render('testPage', {        myVar: 'My Data'    });那就是我的Express代码（对于测试而言非常简单）；现在使用EJS，我想收集这些我知道要呈现在页面上的数据，<%= myVar %>但是我需要能够在JavaScript中收集这些数据（如果可能在.js文件中），但现在只是在我尝试过的“警告”框中显示变量在翡翠中就像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包含的内容。如果其中包含用户生成的内容，则可能会使您的网站保持打开状态，以进行脚本注入攻击。

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

<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>

Answer 2

如果您有更复杂的对象（例如数组），则可以执行以下操作：

<% if (myVar) { %>

   <script>

      myVar = JSON.parse('<%- JSON.stringify(myVar) %>');

   </script>

<% } %>

否则，您之前看到的解决方案将不起作用