导航:首页 > 网站知识 > 如何用vue上线一个网站

如何用vue上线一个网站

发布时间:2023-02-17 18:16:12

① WebSocket使用及在vue如何使用

WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中, 浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输

在 WebSocket API 中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

现在,很多网站为了实现推送技术,所用的技术都是 Ajax 轮询。轮询是在特定的的时间间隔(如每 1 秒),由浏览器对服务器发出 HTTP 请求,然后由服务器返回最新的数据给客户端的浏览器。这种传统的模式带来很明显的缺点,即浏览器需要不断的向服务器发出请求,然而 HTTP 请求可能包含较长的头部,其中真正有效的数据可能只是很小的一部分,显然这样会浪费很多的带宽等资源。

HTML5 定义的 WebSocket 协议,能更好的节省服务器资源和带宽,并且能够更实时地进行通讯。

浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求,连接建立以后, 客户端和服务器端就可以通过 TCP 连接直接交换数据

当你获取 Web Socket 连接后,你可以通过 send() 方法来向服务器发送数据,并通过 onmessage 事件来接收服务器返回的数据。

为了建立一个 WebSocket 连接,客户端浏览器首先要向服务器发起一个 HTTP 请求,这个请求和通常的 HTTP 请求不同,包含了一些附加头信息,其中附加头信息"Upgrade: WebSocket"表明这是一个申请协议升级的 HTTP 请求,服务器端解析这些附加的头信息然后产生应答信息返回给客户端,客户端和服务器端的 WebSocket 连接就建立起来了,双方就可以通过这个连接通道自由的传递信息,并且这个连接会持续存在直到客户端或者服务器端的某一方主动的关闭连接

socket.io 是一个类库,内部封装了 WebSocket,可以在浏览器与服务器之间建立实时通信。

如果某些旧版本的浏览器不支持 WebSocket,socket.io 会使用轮询代替。另外它还具有可发送二进制消息、多路复用、创建房间等特性,因此相比直接使用原生 WebSocket,socket.io 是更好的选择。

开发一个实时应用主要分两部分:服务端和客户端,socket.io 分别提供了相应的 npm 包供我们方便地调用。

接下来就通过一个生动形象且有趣的栗子分别介绍这两大块。

现在假设李白张三,李四,王五 5 个人加入了一个叫 棋牌室 的房间,在文章结束时我们将拥有一个麻雀虽小五脏俱全的峡谷英雄在线聊天室。

客户端的功能到这基本上也开发完了。核心 api 就是 on 和 emit 用于收发消息,既简单又优雅。

阅读全文

与如何用vue上线一个网站相关的资料

热点内容
网络共享中心没有网卡 浏览:516
电脑无法检测到网络代理 浏览:1368
笔记本电脑一天会用多少流量 浏览:559
苹果电脑整机转移新机 浏览:1371
突然无法连接工作网络 浏览:1042
联通网络怎么设置才好 浏览:1217
小区网络电脑怎么连接路由器 浏览:1017
p1108打印机网络共享 浏览:1205
怎么调节台式电脑护眼 浏览:679
深圳天虹苹果电脑 浏览:918
网络总是异常断开 浏览:607
中级配置台式电脑 浏览:975
中国网络安全的战士 浏览:626
同志网站在哪里 浏览:1408
版观看完整完结免费手机在线 浏览:1452
怎样切换默认数据网络设置 浏览:1103
肯德基无线网无法访问网络 浏览:1278
光纤猫怎么连接不上网络 浏览:1458
神武3手游网络连接 浏览:959
局网打印机网络共享 浏览:994