如何将 NodeJS 与 node-rest-client 方法一起使用 post 动态数据到前端 HTML

Question

我是 NodeJS 的新手，所以希望我能够正确表达我的问题。我的目标是创建一个 NodeJS 应用程序，它将使用 node-rest-client 来获取数据并在客户端的 HTML 中异步显示它。

我创建了几个 node-rest-client 方法，目前我在用户导航到 /getdata 页面时调用我的 GET 数据操作。响应已成功记录到控制台，但我正在寻找在 /getdata 页面本身的 HTML table 中动态填充此数据的最佳方法。我想遵循 Node 最佳实践，确保在高用户负载下的持久性，并最终确保我没有编写垃圾代码。

如何将数据 return 从我的 Express 路由绑定到 HTML 前端？
我应该为每个 node-rest-method 使用单独的 "router.get" 路由吗？
如何将 GET 请求绑定到按钮并使其在单击时获取新数据？
我是否应该考虑使用 socket.io、angularjs 和 ajax 将数据从服务器端传输到客户端？

-感谢您的阅读。

这是当前呈现 getdata 页面以及调用我的 getDomains node-rest-client 方法的路由示例。页面呈现正确并且 getDomains 编辑的数据 return 已成功打印到控制台，但是我无法将数据通过管道传输到 /getdata 页面。

router.get('/getdata', function(req, res) {
    res.render('getdata', {title: 'This is the get data page'});

    console.log("Rendering:: Starting post requirement");       

    args =  {
            headers:{"Cookie":req.session.qcsession,"Accept":"application/xml"},
            };

    qcclient.methods.getDomains(args, function(data, response){

        var theProjectsSTRING = JSON.stringify(data);
        var theProjectsJSON = JSON.parse(theProjectsSTRING);

        console.log('Processing JSON.Stringify on DATA');           
        console.log(theProjectsSTRING);
        console.log('Processing JSON.Parse on theProjectsSTRING');
        console.log('');

        console.log('Parsing the array  ' + theProjectsJSON.Domains.Domain[0].$.Name );

    });     
});

我已经开始尝试为我的不同 node-rest-client 方法创建几个路由，这些方法将使用 res.send 到 return 数据，也许我可以绑定一个 AJAX 调用或使用 angularjs 解析数据并显示给用户。

router.get('/domaindata', function(req, res){

            var theProjectsSTRING;
            var theProjectsJSON;

            args =  {
                        headers:{"Cookie": req.session.qcsession,"Accept":"application/xml"},
                    };

            qcclient.methods.getDomains(args, function(data, response){
                //console.log(data);

                theProjectsSTRING = JSON.stringify(data);
                theProjectsJSON = JSON.parse(theProjectsSTRING);

                console.log('Processing JSON.Stringify on DATA');               
                console.log(theProjectsSTRING);             
                console.log('Processing JSON.Parse on theProjectsSTRING');
                console.log('');

                console.log('Parsing the array  ' + theProjectsJSON.Domains.Domain[0].$.Name );

                res.send(theProjectsSTRING);
            }); 
        });

Answer 1

我查看了您的代码。您正在使用 res.render(..) 和 res.send(..)。首先，您应该了解基本的请求-响应周期。请求对象为我们提供了从路由传递的值，响应将 return 在对请求值进行某种处理后返回值。更具体地说，如果值通过 html.

的主体传递，您将使用 req.params and req.body

因此所有响应相关语句(res.send(..),res.json(..),res.jsonp(..),res.render(..)) 应该在你的 function(req,res){...} 的末尾，你没有其他处理可以完成，否则你会得到错误。

根据 javascript 中的现代 Web 应用程序开发实践，Rails 上的 Ruby、ExpressJS、Django、Play 等框架都可以用作 REST 引擎和前端路由逻辑写在javascript中。如果你使用 AngularJS 那么 ngRoute and open source ui-router makes work really easy. If you look closely into some of the popular MEAN seed projects such as mean.io, mean.js 即使他们使用 ExpressJS 作为 REST 引擎并且 AngularJS 在前端完成剩下的重量级工作。

您经常会从后端发送 JSON 数据，因此您可以使用 res.json(..)。要使用来自端点的数据，您可以使用 angularjs ngResource 服务。

让我们来看一个最简单的情况，您有一个 GET /domaindata 端点：

router.get('/domaindata',function(req,res){
..
..
res.json({somekey:'somevalue'});
});

在前端，您可以使用 angularJS ngResource 服务访问它：

var MyResource = $resource('/domaindata');
MyResource.query(function(results){
    $scope.myValue = results; 
    //myValue variable is now bonded to the view.
});

我建议您查看 ui 前端路由的 ui-router。

如果您正在寻找示例实现，那么您可以查看我之前写的 this 项目，它还可以为您提供使用 JSON Web Token 实现登录、会话管理的概述.

有很多东西需要了解，如果您需要任何帮助，请告诉我。

如何将 NodeJS 与 node-rest-client 方法一起使用 post 动态数据到前端 HTML

How to use NodeJS with node-rest-client methods to post dynamic data to front end HTML

ajax

node.js

express

angularjs