AngularJS和WebSockets超越

Question

我刚看了这篇文章,我明白了它的不同之处.但仍然在我脑海里,我有问题.可以/我应该在同一个应用程序/网站中使用它吗？假设我希望AngularJs获取内容并更新我的页面,连接到REST api以及所有最重要的东西.但最重要的是,我还想要实时聊天,或者在收到更新或消息时触发其他客户端上的事件.

Angular支持吗？或者我需要使用像Socket.io这样的东西来触发这些事件？使用两者都有意义吗？如果有人可以帮助我或指导我一些好的阅读,如果有目的的话可以同时使用它们.

希望我足够清楚.感谢您的任何帮助.

Answer 1

Javascript支持WebSocket,因此您不需要额外的客户端框架来使用它.请看一下这个基于WebSocket的AngularJS应用程序中声明的$ connection服务.

基本上你可以听取消息:

   $connection.listen(function (msg) { return msg.type == "CreatedTerminalEvent"; }, 
        function (msg) {
            addTerminal(msg);
            $scope.$$phase || $scope.$apply();
   });

听一次(非常适合请求/回复):

    $connection.listenOnce(function (data) {
        return data.correlationId && data.correlationId == crrId;
    }).then(function (data) {
        $rootScope.addAlert({ msg: "Console " + data.terminalType + " created", type: "success" });
    });

并发送消息:

    $connection.send({
        type: "TerminalInputRequest",
        input: cmd,
        terminalId: $scope.terminalId,
        correlationId: $connection.nextCorrelationId()
    });

通常,由于WebSocket连接是双向的并且具有良好的支持,因此您还可以使用它在请求/响应模型中从服务器获取数据.你可以有两个型号:

• 发布者/订阅者:客户端声明其对某些主题感兴趣并为具有该主题的消息设置处理程序,然后服务器在其认为合适时发布(或推送)消息.

• 请求/响应:客户端发送带有requestID(或correlationId)的消息,并侦听该requestId的单个响应.

尽管如此,如果需要,您可以同时使用两者,并使用REST获取数据,使用WebSocket获取更新.

在服务器端,您可能需要使用Socket.io或任何服务器端框架,以便拥有支持WebSocket的后端.

Answer 2

如链接帖子中的答案所述,Angular目前没有内置的Websockets支持.因此,您需要直接使用Websockets API,或使用其他库,如Socket.io.

然而,要回答你的,如果你要在一个单一的角度应用同时使用REST API和WebSockets的问题,没有任何理由,你不能有一个与REST API交互包括标准的XmlHttpRequest请求,使用$ HTTP或其他数据层诸如BreezeJS之类的库,用于包含在应用程序的各个部分中的某些功能,并且还使用Wesockets用于另一部分(例如,实时聊天).

Angular旨在帮助处理此类场景.一个典型的解决方案是创建一个或多个控制器来处理应用程序功能并更新页面,然后创建单独的服务或工厂,封装每个数据端点的数据管理(即REST api和实时聊天服务器) ),然后注入控制器.

有关使用角度服务/工厂来管理数据连接的大量信息.如果您正在寻找有助于指导如何构建Angular应用程序以及数据服务适合的资源,我建议您查看John Papa的AngularJS样式指南,其中包括有关数据服务的部分.

有关工厂和服务的更多信息,您可以查看AngularJS:何时使用服务而不是工厂