如何从Riot.js快递服务器将JSON数据返回给Node.js？

Question

我正在开发一个web应用程序，客户端使用Riot.js，服务器端使用Node.js express。Riot.js可以挂载JSON数据，并可用于呈现HTML。实际上，我在服务器端有一些JSON数据，并且希望与Riot.js一起使用它们。

目前，我的快递服务器代码非常简单。

  var express = require('express'),                                                                                             
      serveIndex = require('serve-index'),                                                                                      
      app = express();                                                                                                          

  app.use(express.static(__dirname + '/public'));                                                                               
  app.use(serveIndex(__dirname + '/public'));                                                                                   
  app.listen(3000);  

我认为HTML模板对我的问题很有帮助。但是我在Riot.js中找不到答案，我如何使用和呈现来自服务器的数据？

• Node & Express -如何在一个请求中向浏览器发送页面和一些JS数据？

如果数据位于客户端，我知道如何装入数据，如下所示：

    <script>                                                                                                                   
      riot.mount('my_hoge', {                                                                                                
        data: [                                                                                                                
          { name: 'A', url: 'xxxx'},                                                                                           
          { name: 'B', url: 'yyy', isActive: true},                                                                          
          { name: 'C', url: 'zzzz'}                                                                                           
        ]                                                                                                                            })                                                                                                                       
   </script>   

环境

• Node.js v5.3.0
• 快递v4.13.3

Answer 1

可以使用AJAX将JSON数据加载到Riot.js元素中，如下所示：

var url = "http://yourserver:3000/";
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        var data = JSON.parse(xmlhttp.responseText);
        riot.mount('my_hoge', { data: data });
    }
}
xmlhttp.open("GET", url, true);
xmlhttp.send();

Answer 2

在其中一个示例中，他们使用获取 API从服务器获取数据。

window.fetch('http://api.fixer.io/latest?base=USD')
  .then(function(response) { return response.json() })
  .then(function(data) {
    var rates = Object.keys(data.rates)
      .map(function (key) { return { title: key, price: data.rates[key] }})
      .sort(function(a, b) { return a.price - b.price })
    self.update({ rates: rates })
})

链接到回购