在 Angular4 中使用网络套接字？答案

【问题标题】：Using web-sockets with Angular4?在 Angular4 中使用网络套接字？
【发布时间】：2017-06-30 19:05:00
【问题描述】：

如何在 Angular4 中使用网络套接字？ HttpModule 不支持，有没有可以使用的 NPM 包？

设置：

数据库的 MS SQL DB

【问题讨论】：

【解决方案1】：

Angular 不提供支持 WebSockets 的特殊对象。但好消息是所有浏览器都支持 WebSocket，您可以在 Angular4 应用程序中使用它。在这个应用程序中，我在服务器（Node.js）上使用 ws 包，在客户端使用浏览器的 WebSocket 对象（参见https://github.com/Farata/angular2typescript/blob/master/Angular4/auction/client/src/app/product-detail/websocket.service.ts）

【讨论】：

【解决方案2】：

一个选项，您始终可以使用 Firebase（顺便说一句，这是一个非常有趣的选项）。几乎所有繁重的工作都为您完成。

否则，WebSockets 是 HTML5 标准。你只需要编写一些代码来实现它。查看这个包含各种信息、回声演示/测试等的网站：

【讨论】：

我的后端数据库是 MS SQL DB，而不是 Firebase。
那真的没关系。我已经集成了 Firebase 登录并推送到应用程序中，而不将其用作我的数据库。但除此之外，Web 套接字实现起来并不复杂，您可以轻松创建模块/服务。再次查看 websocket.org。你仍然需要做后端工作，但同样有各种各样的包，python 等。

【解决方案3】：

你可以使用socket.io-client，安装的时候一定要包含types。

安装： npm install --save socket.io-client

和

npm install --save @types/socket.io-client 或 npm install --save-dev @types/socket.io-client

注意：如果有兴趣，有一个很棒的教程，其中包括对 MEAN 全栈环境的指导here。

edit: 正如其他人所提到的，WebSocket 是一种 HTML5 标准。这将为前端套接字交互创建一个易于使用的界面，并且适用于任何后端环境。

【讨论】：

【解决方案4】：

我在我的 Angular 项目中使用 angular2-websocket/angular2-websocket，它工作得很好 https://github.com/afrad/angular2-websocket

【讨论】：