具有Node / Express响应的MEAN堆栈更新视图

时间:2017-01-11 19:08:50

标签: angularjs node.js mongodb express mean-stack

我有一个MEAN堆栈仪表板应用程序(server1),它与nodejs / express服务器(server2)进行通信,后者向mongoDB发出查询。例如,用户应该通过仪表板应用程序日历选择一个月,并且该日期将被发送到将查询mongo的nodejs / express服务器并返回例如您在该月期间去健身房的次数。

我得到了正确的回复但是我在更新视图时遇到了问题(因为http请求是异步的,响应中的请求执行得更快,因此用错误的值更新我的视图)

我按如下方式处理了我的请求:

仪表板应用 - 角度前端

$scope.query = function () {
        console.log("I am hereee");
        var month = ("0" + ($scope.dt.getMonth() + 1)).slice(-2);
        var date = $scope.dt.getFullYear() + "" + month;
        var queryData = JSON.stringify({MemberID_Hash: $scope.memberNo, Date_Key_Month: date});
        console.log("data: ", queryData);
        console.log("url: ", expressQuery);
        $http({ //send query to node/express server
            method: 'POST',
            url: expressQuery,
            data: queryData,
            withCredentials: true,
            headers: {
                    'Content-Type': 'application/json; charset=utf-8'
            }
        }).then(function(response) { //read backend response
            console.log (">>>>>>>>");
            $http({
            method : "POST",
            url : "http://localhost:9000/sendToController"
            }).then(function mySucces(response) {
              console.log("responde.data: ", response.data);
              $scope.nrOfSwipes = response.data;
            }, function myError(response) { });
        });
    };  

信息中心应用 - 快递后端

var dataController = "test"; // used a global variable to save the response value to update my view (bad design => thus, any help/suggestions would be greatly appreciated)

module.exports = function(app) {

    // receives the response from server2 - !! this is executed 2nd
    app.post('/getQueryJson', function(request, response) {
        if(response.statusCode == 200) { 

          console.log("In routes.js TESTING......")
          console.log("This is your request: ", request.body);

          dataController = request.body;
          console.log("dataController1: ", dataController);
          response.send(request.body);
        }else{
          response.send(" Error code: " + response.statusCode);
        }
    });

    // updates the view - !! this is executed first
    app.post('/sendToController', function(request, response) {
        console.log("dataController2: ", dataController);
        response.send(dataController);
    });
};

问题是请求需要更长的时间来处理,所以我的响应调用 sendToController 然后先执行 getQueryJson 。 知道如何改变他们的执行方式吗?或任何想法是否可以将 / getQueryJson 的响应直接发送到前端控制器,而无需向 / sendToController 发出另一个请求?

我刚刚开始接触MEAN堆栈,所以我意识到这可能听起来像一个基本问题,但我真的被卡住了。

1 个答案:

答案 0 :(得分:2)

虽然您已经将承诺链接起来,但由于您没有返回frame,因此订单会有所不同。编辑代码以强制执行订单。

Promise

进一步检查您的代码,我看到,$http({ method: 'POST', url: expressQuery, data: queryData, withCredentials: true, headers: { 'Content-Type': 'application/json; charset=utf-8' } }).then(() => { return $http({ method: 'POST', //read backend response url: 'http://localhost:9000/sendToController' }); }).then((response) => { console.log(`responde.data: ${response.data}`); $scope.nrOfSwipes = response.data; }).catch((err) => { //if error occurs console.log('err', err.stack); }); 的来电不接受来自sendToController的任何输入。如果那是实际情况。你可以使用getQueryJson

对您的代码进行此更改。

Promise.all()
  

或者是否有可能我可以将/ getQueryJson的响应直接发送到前端控制器而无需向/ sendToController发送另一个请求?

是。我们能做到这一点。你需要在json中回复对象。但是你提供给我们的代码似乎是占位符。如果你可以合并它们。它可能看起来像

Promise.all([
  $http({
    method: 'POST',
    url: expressQuery,
    data: queryData,
    withCredentials: true,
    headers: {
      'Content-Type': 'application/json; charset=utf-8'
    }
  }),
  $http({
    method: 'POST',  //read backend response
    url: 'http://localhost:9000/sendToController'
  })
]).then((responses)=> {
  let ctrlResponse = responses[1];
  console.log(`responde.data: ${ctrlResponse.data}`);
  $scope.nrOfSwipes = ctrlResponse.data;
}).catch((err) => {
  console.log('err', err.stack);
});