在包含的前端 js 文件中使用服务器生成的变量

Question

node.js初学者。所以我正在编写一个应用程序，每秒我都会得到一个服务器生成的数字并通过应用程序粘贴它。转到我的 index.pug 文件，我想在嵌入的 js 文件中使用该数字。我该怎么做？

server.js

randomNumber = 4;
app.get('/',(req,res) => {
    res.render('index', {title: 'Number', count: randomNumber})
});

index.pug

html
 head
  title= title
 body
  h1= count
  script(src="includes/client.js")

client.js

var chart = new CanvasJS.Chart("chartContainer", { 
   title: {
    text: count
   },
});

现在如何使用 client.js 文件中的 randomNumber 变量？我在这里错过了什么？应用程序总是告诉我 count is not defined

Answer 1

您需要记住，您的请求中存在三个独立的 Javascript 上下文：

None 除非您显式地将变量传递给链中的下一个变量，否则上面的

None 可以访问任何其他变量。

您在 res.render 语句中明确将标题和计数传递到 view/template 中，然后将它们进一步传递到浏览器中，您需要使用 unescaped string interpolation 并添加将其放入 <script> 标签中，如下所示：

html
 head
  title= title
 body
  h1= count
  script.
    var count = !{count};
  script(src="includes/client.js")

如果您希望 count 作为字符串通过，请改为这样定义它：

html
 head
  title= title
 body
  h1= count
  script.
    var count = "!{count}";
  script(src="includes/client.js")

Use server generated variable in an included frontend js file