在 node.js 中使用变量值填充 javascript 文件答案

【问题标题】：Populate javascript file with variable value in node.js在 node.js 中使用变量值填充 javascript 文件
【发布时间】：2016-09-20 19:20:33
【问题描述】：

我使用node.js、express.js 和pug/jade。

在我的服务器中，我使用变量 pageId 填充视图。

我在pug 视图中使用此变量

script.
  document.addEventListener('DOMContentLoaded', function () {
    var pageId = '#{pageId}';

    (...)

问题是我希望此脚本代码位于单独的文件中，而不是在我的视图中。

所以我想包含脚本

script(src='js/my_script.js')

但是我无法在脚本中获取变量的值。

这通常是如何完成的？将变量从服务器发送到客户端视图中的脚本代码似乎是错误的。

我想我使用pug.js 是无关紧要的，因为即使在纯 html 中也会出现同样的问题。

【问题讨论】：

<script>someglobalobj.someval = '#{pageId}'</script>，或 ajax。您可以让您的服务器端代码解析所有 .js 文件，但是......不。 pageId不在url中吗？
你应该看看 webpack 或 npm 模块“config”之类的东西。也看到这个问题stackoverflow.com/questions/30030031/…
实际上不仅仅是pageId。它也是我用来绘制d3.js 图形的大量 json 格式的数据。所以在一个页面上，我得到了一些 json 格式的数据，而在另一个页面上，我得到了一些 json 格式的数据。所以不可能直接在.js文件中硬编码数据。

【解决方案1】：

您可以在客户端 JS 文件中定义一个接收数据的全局函数，然后从服务器渲染页面上的内联脚本调用该函数。

例如在script.js:

function logPageId(id) {
  console.log(id);
}

然后在你的服务器渲染页面中：

<html>
  <body>
    <script src="script.js"></script>
    <script>
      logPageId('somePageId')
    </script>
  </body>
</html>

您可以使用 JSON 字符串作为输入来执行相同的操作。

【讨论】：