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

本文关键字：模式 应用程序 SignalR 跟踪 Web 使用 | 更新日期: 2023-09-27 18:35:51

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

这些统计数据要求我们在用户使用应用程序时记录用户活动。我正在考虑使用 SignalR 将此类活动数据发送到服务器。我们会频繁地请求服务器记录活动数据（即发即弃模型）。

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

此外，我们是否可以利用一些可用的东西来构建这样的解决方案。

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

我认为最好的选择应该是在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 的单独文件夹，其中包含集线器和一个集线器激活器文件（我更喜欢针对 signalR 依赖项解析器的解决方案）来解决我的依赖项。

在这种情况下，您可以创建类似以下内容的内容：

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），然后您需要创建方法来跟踪用户信息并将您需要的信息放入该对象。

在客户端，您需要为 signalR i 视图添加一个 jquery 文件 （jquery-signalR-version.js），该文件为集线器创建动态客户端方法，最后您需要为 signalR 客户端创建一个 angularJs 包装器。

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();
}

我希望这有所帮助

相关文章：