AngularJS e WebSockets além

Acabei de ler este post e entendo qual é a diferença. Mas ainda na minha cabeça eu tenho a pergunta. Posso / devo usá-lo no mesmo aplicativo / site? Digamos que eu queira que o AngularJs busque conteúdo e atualize minha página, conectando-me a uma API REST e a todas essas informações importantes. Mas, além disso, também quero um bate-papo em tempo real ou triggersr events em outros clientes quando houver uma atualização ou uma mensagem recebida.

Angular apóia isso? Ou eu preciso usar algo como Socket.io para acionar esses events? Faz sentido usar os dois? Se alguém puder me ajudar ou me indicar uma boa leitura sobre isso, se houver um propósito de usar os dois juntos.

Espero que eu seja claro o suficiente. Obrigado por qualquer ajuda.

Javascript suporta WebSocket, então você não precisa de uma estrutura adicional do lado do cliente para usá-lo. Por favor, dê uma olhada neste serviço de conexão $ declarado neste aplicativo AngularJS baseado WebSocket .

Basicamente você pode ouvir mensagens:

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

Ouça uma vez (ótimo para solicitação / resposta):

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

E envie mensagens:

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

Normalmente, como uma conexão WebSocket é bidirecional e tem um bom suporte , você também pode usá-la para obter dados do servidor no modelo de solicitação / resposta. Você pode ter os dois modelos:

  • Editor / Assinante : Onde o cliente declara seu interesse em alguns tópicos e define manipuladores para mensagens com esse tópico e, em seguida, o servidor publica (ou envia) mensagens sempre que achar adequado.

  • Solicitação / resposta : onde o cliente envia uma mensagem com um requestID (ou correlationId) e escuta uma única resposta para esse requestId.

Ainda assim, você pode ter os dois, se desejar, e usar o REST para obter dados e o WebSocket para obter atualizações.

No lado do servidor, você pode precisar usar o Socket.io ou qualquer estrutura do lado do servidor para ter um backend com suporte a WebSocket.

Como observado na resposta em sua postagem vinculada, o Angular atualmente não tem suporte interno para Websockets. Então, você precisaria usar diretamente a API do Websockets ou usar uma biblioteca adicional como o Socket.io.

No entanto, para responder à sua pergunta se você deve usar uma API REST e Websockets em um único aplicativo Angular, não há motivos para não ter as solicitações XmlHttpRequest padrão para interagir com uma API REST, usando $ http ou outra camada de dados biblioteca como BreezeJS, para certas funcionalidades incluídas em várias partes da aplicação e também usa Wesockets para outra parte (por exemplo, chat em tempo real).

O Angular foi projetado para ajudar a lidar com esse tipo de cenário. Uma solução típica seria criar um ou mais controladores para manipular a funcionalidade do aplicativo e atualizar sua página e, em seguida, criar Serviços ou Fábricas separados que encapsulem o gerenciamento de dados de cada um dos pontos finais de dados (ou seja, a API REST e o servidor de bate-papo em tempo real). ), que são então injetados nos Controladores.

Há uma grande quantidade de informações disponíveis sobre o uso de serviços / fábricas angulares para gerenciar conexões de dados. Se você está procurando um recurso para ajudar a orientar você sobre como construir um aplicativo Angular e onde os serviços de dados se encheckboxm, recomendo verificar o AngularJS Styleguide do John Papa, que inclui uma seção sobre Serviços de Dados .

Para mais informações sobre fábricas e serviços, você pode conferir AngularJS: Quando usar o serviço em vez de fábrica