javascript - 如何将 JSON 数据从 Node js 路由传递到 html 文件中的脚本?

标签 javascript jquery json node.js mongodb

我正在尝试使用 mongodb 集合中的数据填充索引 html 中的下拉列表。我有如下所示的填充代码:

    <script>
        document.addEventListener("DOMContentLoaded", function() {
          for (element in mongoData){
            var option = document.createElement('option');
            option.innerHTML = element;
            option.value = element;
            document.getElementById('Active_Sessions').append(option);
          }
        });
      </script>

在app.js中,我的路线如下:

    app.use("/",(req,res) => {
        res.sendFile(__dirname + "/index.html")
     })

我需要将 JSON 对象“mongoData”传递给此 html,但我不确定如何执行此操作。 “mongoData”将是从给定集合中收集的一些数据的 JSON。

我想到但尚未实现的一个解决方案是将此 mongodata 写出到文本文件或 csv 文件或来自 app.js 的类似文件,然后从我的填充脚本中读入该文件。我觉得这会是一种糟糕的形式,而且不是很安全。

我想到的另一个选择是尝试在填充脚本中连接到 mongoose 服务器,但是当我尝试这个时,它不起作用,所以我有点假设这是不可能的。

在发布这篇文章之前,我已经研究过使用 res.render() 发送 JSON,但我并不真正理解模板是什么,如果我能避免的话,我宁愿不必了解所有这些.

有没有优雅的解决方案?

最佳答案

您将更改服务器中的数据,例如通过模板引擎。

或者您可以构建类似的东西来执行相同的操作。虚拟逻辑:

  1. 使用 fs 模块读取文件。
  2. 使用正则表达式替换/插入您的内容(例如从您的对象)。
  3. 将结果发送给客户。

更新:自定义模板引擎的一个简单示例。

首先是一个简单的 html 文件 - index.html(请注意 $replace_me):

<html>
  <body>
    <div class="circle">
      $replace_me

      <div class="square">
        something else
      </div>
    </div>
  <body>
</html>

在我们的 Node 服务器中,我们可以做这样的事情:

var fs = require('fs');

//used sync for clean demo, use async in production
var _html_cont = fs.readFileSync('index.html', {encoding: 'utf-8'});

//dynamic content to replace
var _repl = "<div>I am new!</div>";

//actually replace it
var _im_regex = new RegExp("\\$replace_me", "gm");
_html_cont = _html_cont.replace(_im_regex, _repl);

 //send result to client
 res.writeHead(200, { 'content-type': 'text/html' });
 res.write(_html_cont);
 res.end();

关于javascript - 如何将 JSON 数据从 Node js 路由传递到 html 文件中的脚本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50245795/

相关文章:

javascript - MSXML2.XMLHTTP 请求将选择什么版本,没有版本后缀?

javascript - 具有硬编码响应的 HTML5 jQuery 聊天框界面

javascript - 泰语 JSON 解码无法正常工作

json - Postgres RFC3339 日期时间格式

java - 通过java从mysql的数据创建json对象

javascript - 在 Rails 应用程序中显示图形和图表?

javascript - 使用 Adob​​e AIR 进行 Shoutcast 流缓冲而不使用 Flash/Flex 播放器?

javascript - 了解窗口方法

javascript - jQuery ticker 在 jsfiddle 中有效,但在 .HTML 中无效

jquery - 如何添加 !important 到类