NodeJS、AngularJS - 在服务器中发布事件并监听答案

【问题标题】：NodeJS, AngularJS - Publishing events in server and listeningNodeJS、AngularJS - 在服务器中发布事件并监听
【发布时间】：2016-04-18 16:40:18
【问题描述】：

我正在使用 MEAN 堆栈开发 Web 应用程序。在我的节点服务器上，我有一个 POST 路由 - /api/gps，远程设备以 10 秒左右的间隔定期向该路由发布 GPS 数据。我通过获取 post body 并将时间戳、tripid、纬度、经度等详细信息保存到我的 MonngoDB 集合来服务此 POST 请求。现在这是我被困的地方 - 我有一条路线 - /displaymap，它由 displaymap.jade 渲染并与控制器 - MapDisplayCtrl 相关联。在这里，我必须显示设备最近发布的 GPS 数据的地图。那么，如何在获得新的 POST 数据到 /api/gps 后立即更新地图？

app.js 文件

var GPSData = mongoose.model('GPSData', gpsSchema);
app.post('/api/particle', function(req, res) {
    GPSData.create({
                tripid : req.body.tripId,
                latitude: req.body.latitude,
                longitude: req.body.longitude,
                timestamp: Date.now()
            }, function(err, doc) {
                if(err) {
                    res.send(err);
                } else {
                    res.send(doc);
                    //here is where I want to publish an event say, 'SendMapData'
                    //that sends co-ordinates to the controller
                }
            });
    });

MapDisplayCtrl.js 文件

var myApp = angular.module('myapp');

myApp.controller('MapDisplayCtrl', function($http, $scope) {
     //listen to the 'SendMapData' event and get the co-ordinates
     //draw a google map using the co-ordinates
});

我想我只需要一个 NodeJS 端的事件发射器和一个 AngularJS 端的监听器，但我不知道如何实现它。我希望我已经提供了足够的信息供您回答。如果您需要更多信息，我会提供。提前致谢！

【问题讨论】：

标签： javascript angularjs node.js mean-stack

【解决方案1】：

您可以使用socket.io在服务器和客户端之间进行实时通信。

服务器：

//here is where I want to publish an event say, 'SendMapData'
//that sends co-ordinates to the controller
socket.emit('SendMapData', data);

控制器：

 //listen to the 'SendMapData' event and get the co-ordinates
 //draw a google map using the co-ordinates
 socket.on('SendMapData', function(serverData) {
     //do what you want with data received from server.
 });

对于文档检查socket.io（不是最好的文档，但它有帮助）

编辑
为了在有角度的应用程序中使用socket.io，成为“有角度的方式”，我为此构建了一个服务（不是我自己，受 SO 的启发）：

MYAPP.factory('socket', ['$timeout', function($timeout){
    var socketMethods = {},
        socketio;

    //fn: connect
    //desc: connect to server
    socketMethods.connect = function(server){
        if( ! angular.isUndefined(socketio)) return;

        var ioUrl = 'ws://'+ server.fullAddr;
        var ioManager = {transports: ['websocket', 'polling'], reconnectionAttempts: Infinity};
        socketio = io(ioUrl, ioManager);
    }

    //fn: on
    //desc: receive data from server
    socketMethods.on = function(eventName, callback){
        //check if event is already registered; 'connect' registered by default, ignore it.
        if(socketio.hasListeners(eventName) && eventName != 'connect') return;
        socketio.on(eventName, function(serverData, respondToServer){
            $timeout(function(){
                callback.call(socketio, serverData, respondToServer);
            });
        });
    }

    //fn: emit
    //desc: send data to server
    socketMethods.emit = function(eventName, data, callback){
        socketio.emit(eventName, data, function(serverResponse){
            $timeout(function(){
                if(callback) callback.call(socketio, serverResponse);
            });
        });
    }

    return socketMethods;
}]);

...您可以在控制器中注入“套接字”，打开套接字连接并监听/发出事件。

【讨论】：