数字货币交易系统在线文档多人编辑在线客服系统都要用的技术

　　一、WebSocket概述
　　WebSocket是一种在单个TCP连接上进行全双工通信的协议，使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据，在WebSocketAPI中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的链接，并进行双向数据传输
　　在WebSocket出现之前，我们想要获取服务端的数据只能通过客户端向服务端发送请求，但是如果当服务端响应数据，客户端想要实时的更新，我们采用的是Ajax轮询，但是非常浪费资源和降低性能，并且不能真正的实时刷新，WebSocket可以解决这个问题
　　二、WebSocket使用1、Express服务端
　　安装依赖npmisocket。io
　　projectws。jsconstexpressrequire（express）；constappexpress（）；实例化WebSocket对象letwsrequire（http）。Server（app）；variorequire（socket。io）（ws）；监听端口server。listen（3000，（）｛console。log（服务器已连接）；｝）；监听connection如果有客户端进行连接，那么会监听io。on（connection，function（socket）｛console。log（建立连接。。。。。。）；监听handler当客户端触发了handler事件，那么会监听到socket。on（handler，function（data）｛console。log（data）；你好，我是客户端的数据｝）；触发show事件并且传递数据show是客户端方法socket。emit（clientHandler，你好，我是服务端数据）；｝）；2、Vue2客户端
　　安装依赖npmivuesocket。iosocket。ioclient
　　注册WebSocket
　　projectmain。jsimportVuefromvueimportAppfrom。App。vueimportrouterfrom。routerimportstorefrom。storeVue。config。productionTipfalseimportSocketIOfromvuesocket。io；importClientSocketIOfromsocket。ioclient；Vue。use（newSocketIO（｛debug：false，connection：ClientSocketIO。connect（ws：localhost：3000，｛transports：〔websocket〕，autoConnect：false默认不建立连接｝）｝））；newVue（｛router，store，render：hh（App）｝）。mount（app）
　　组件中使用WebSocket
　　projectsrcviewsWebSocket。vuetemplateh1｛｛msg｝｝h1templatestylelangscssscopedstyle