使用SignalR跟踪Web应用程序使用模式

Question

我们在服务器上使用ASP.Net并在客户端上使用AngularJS创建了一个Web应用程序。此处的要求之一是跟踪Web应用程序中各个部分的使用情况。

这些统计信息要求我们在使用应用程序时记录用户活动。我正在考虑使用SignalR将这些活动数据发送到服务器。我们会频繁请求服务器记录活动数据（火灾和忘记模型）。

我的问题是，这是一个使用SignalR的好用例。由于它既不涉及双向通信，也不对连接的客户端实时更新数据。

还有一些可用的东西，我们可以利用它来构建这样的解决方案。

Answer 1

我认为最好的选择应该是在angularJS中创建一个httpInterceptor并跟踪你想要的任何内容（或你手头的信息），你可以在客户端创建一个服务，连接并将信息发送到你的日志服务在您的服务器中以异步方式。

$provide.factory('loggerHttpInterceptor', function($q, logService) {
  return {
    'request': function(config) {
      var deferred = $q.defer();
      deferred.resolve(function(){
          logService.send('someuser','some action',config.url,'other info');
      });

  return {config: $q.when(config), logger: deferred.promise};
 //Other code for errors / response...etc

});

$httpProvider.interceptors.push('loggerHttpInterceptor');

修改

如果你想使用signalR，你应该使用集线器，它们更容易实现，例如我在我的解决方案中有一个单独的文件夹，名为signalR，带有集线器和hubActivator文件（我更喜欢这个解决方案） signalR dependencyResolver）来解决我的依赖关系。

在这种情况下，你可以创建像：

public class TrackerService : Hub
 {
    private readonly ICacheClient _cacheClient;
    private readonly ILogger_logger;
    public TrackerService(ILogger logger,ICacheClient cacheClient){
        _logger logger;
        _cacheClient = cacheClient; 

    }
    public override Task OnConnected(){
        var session = _cacheClient.SessionAs<IAuthSession>();
        //Get the current user, insert into a conected users list (that´s not 100% mandatory)
    }
    public override Task OnDisconnected(){
       //Delete the user from the list
    }

    public void EventTracker(PageInfo pageInfo){
    }

 }

选择服务堆栈提供的记录器OOB或创建您自己的跟踪器，通常您需要覆盖集线器中的两种方法：OnConnected和OnDisconnected值得一提的是，一个用户可以拥有多个通常，您可以使用存储在静态变量或缓存中的用户列表（我更喜欢SS缓存，暂时使用InMemoryCache），然后您将需要一个连接（浏览器中的多个选项卡或多个设备）创建跟踪用户信息的方法，并将所需信息放入该对象。

在客户端，您需要为您的视图添加一个jquery文件（jquery-signalR- 版本 .js），这个文件为集线器创建动态客户端方法，最后你需要在angularRs中为angularR客户端创建一个包装器。

factory('signalRHubProxy', ['$rootScope', 'signalRServer',
    function($rootScope, signalRServer) {

        function signalRHubProxyFactory(serverUrl, hubName) {
            var connection = $.hubConnection(signalRServer);
            var proxy = connection.createHubProxy(hubName);


            return {
                on: function(eventName, callback) {
                    proxy.on(eventName, function(result) {
                        $rootScope.$apply(function() {

                            if (callback) {
                                callback(result);
                            }
                        });
                    });
                },
                off: function(eventName, callback) {
                    proxy.off(eventName, function(result) {
                        $rootScope.$apply(function() {
                            if (callback) {
                                callback(result);
                            }
                        });
                    });
                },
                invoke: function(methodName, params, callback) {
                    proxy.invoke(methodName, params)
                        .done(function(result) {
                            $rootScope.$apply(function() {
                                if (callback) {
                                    callback(result);
                                }
                            });
                        });
                },
                start: function() {
                    connection.start().done(function() {
                        console.log("Connected, transport = " + connection.transport.name);
                    });
                },
                connection: connection
            };
        }


        return signalRHubProxyFactory;
    }])

然后您可以在控制器中使用代理：

function trackActivityCtrl($scope, $resource, signalRHubProxy) {
    var hubProxy, pageInfo;
    pageInfo.something = $scope.InfoToTrack
    hubProxy.on("EventTracker", function (pageInfo) {
        //logic to track the activity
    });
    hubProxy.start();
}

我希望有帮助