javascript - 将 JSON 响应解析为 node.js / express 中车把视图的变量

Question

我正在寻找一种方法来呈现一个视图，该视图将具有一个包含从 API 获取的数据的变量。我正在使用快递、车把和请求。

这是网络服务器的路由器代码：

const express = require('express');
const router = express.Router();
const request = require('request');

router.get('/projects', (req, res) => {
    request('http://localhost:8080/NpZke93tNYf9eR07fIDm/reports/projects', (error, response, body) => {
        res.render('projectsPage', {projects: JSON.stringify(response.body)});
    })
});
// returns:
// {"data":[{"project":"project 1","details":"details of project 1"},{"project":"project 2","details":"some other details"}],"message":"ok","code":200}

这是车把视图的代码（projectsPage.hbs）：

<h1>Available Projects</h1>
<script>
    var myData = "{{projects}}";
</script>

问题是我在渲染视图时，myData 变量包含 JSON.parse() 无法解析的内容。

>myVar
""{"data":[{"project":"project 1","details":"details of project 1"},{"project":"project 2","details":"some other details"}],"message":"ok","code":200}""

我要做的是渲染一个页面，该页面将使用 Chart.js 呈现数据（这就是为什么我需要将数据作为对象提供）。我不想从前端直接调用 API（不公开 api 密钥）。

有没有办法让它工作而不必使用 String.replace() 方法？我的方法有效还是有更好的方法来做到这一点？

Answer 1

改变

<h1>Available Projects</h1>
<script>
    var myData = "{{projects}}";
</script>

至

<h1>Available Projects</h1>
<script>
    var myData = {{{projects}}}
</script>

在 Javascript 上创建 Chart 实例时，请使用以下命令：

data: JSON.parse(myData),