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
"&quot;{&quot;data&quot;:[{&quot;project&quot;:&quot;project 1&quot;,&quot;details&quot;:&quot;details of project 1&quot;},{&quot;project&quot;:&quot;project 2&quot;,&quot;details&quot;:&quot;some other details&quot;}],&quot;message&quot;:&quot;ok&quot;,&quot;code&quot;:200}&quot;"

我要做的是渲染一个使用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),

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

1 个答案: