Simonzhangs' blog Simonzhangs' blog
首页
  • 前端文章

    • HTML
    • CSS
    • JavaScript
  • 学习笔记

    • 《JavaScript教程》
    • 《JavaScript高级程序设计》
    • 《ES6 教程》
    • JS设计模式总结
  • 《Vue》
  • 《React》
  • 《TypeScript 从零实现 axios》
  • TypeScript
  • 技术文档
  • GitHub技巧
  • Nodejs
  • 博客搭建
  • apple music
  • extension
  • 学习
  • 面试
  • 心情杂货
  • 实用技巧
  • 友情链接
关于
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

Simonzhangs

前端学习探索者
首页
  • 前端文章

    • HTML
    • CSS
    • JavaScript
  • 学习笔记

    • 《JavaScript教程》
    • 《JavaScript高级程序设计》
    • 《ES6 教程》
    • JS设计模式总结
  • 《Vue》
  • 《React》
  • 《TypeScript 从零实现 axios》
  • TypeScript
  • 技术文档
  • GitHub技巧
  • Nodejs
  • 博客搭建
  • apple music
  • extension
  • 学习
  • 面试
  • 心情杂货
  • 实用技巧
  • 友情链接
关于
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • 技术文档

  • GitHub技巧

  • Nodejs

  • 博客搭建

  • Ajax

  • 计算机网络

    • 一篇文章了解cookie与session、token
    • Web开发常见攻击及应对方法
    • 浏览器渲染过程
    • WebSocket梳理
    • 35.TCP协议与UDP协议
    • HTTP常见状态码
    • DNS为什么使用UDP和TCP协议
    • HTTP协议相关总结
  • 计算机编译原理

  • 涨知识

  • 技术
  • 计算机网络
simonzhangs
2022-04-16

WebSocket梳理

WebSocket 是基于TCP的协议,可以用来做即时通信;同时基于HTTP协议也是基于TCP协议的,WebSocket依赖于HTTP连接。

# 常见问题

  1. WebSocket 依赖于HTTP连接,那么它如何从连接的HTTP协议转化为WebSocket协议的?

每个WebSocket 连接都始于一个HTTP请求。具体来说,WebSocket协议在第一次握手连接时,通过HTTP协议在传送WebSocket支持的版本号、协议的字版本号、原始地址、主机地址等等一些列字段给服务器端:

GET /chat http/1.1
Host: server.example.com
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-key: dGhlIHNhbXBsZSBub25jZQ==
Sec-WebSocket-Protocol: chat, superchat
origin: http://example.com
Sec-WebSocket-Version: 13
1
2
3
4
5
6
7
8

Upgrade、Connention字段:这个是WebSocket的核心,告诉Apache、Nginx等服务器,发起的请求要用WebSocket协议,让服务器找到对应的协议处理;

Sec-WebSocket-key字段,它是一个base64 encode的值,这个是浏览器随机生成的,发送给服务器用以验证是否为WebSocket协议通信;

Sec-WebSocket-Protocol字段:是用户定义的字符串,用来区分同一个url下,不同的服务所需要的协议。

Sec-WebSocket-Version:告诉服务器所使用的WebSocket Draft(协议版本)。

然后服务器会返回下列信息,表示已经接收到请求,成功建立WebSocket:

HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: HSmrc0sMlYUkAGmm5OPpG2HaGWk=
Sec-WebSocket-Protocol: chat
1
2
3
4
5

其中Upgrade、Connection字段告诉客户端,已经成功切换协议到WebSocket;

Sec-WebSocket-Accept:经过服务器确认,并且加密过后的Sec-WebSocket-key;用以客户端确认校验;

Sec-WebSocket-Protocol:最终使用的协议。

至此,HTTP完成了它所有的工作,接下来就是完全按照WebSocket协议进行了。

  1. WebSocket为什么要依赖于HTTP协议的连接?
编辑 (opens new window)
上次更新: 2022/04/22, 16:59:50
浏览器渲染过程
35.TCP协议与UDP协议

← 浏览器渲染过程 35.TCP协议与UDP协议→

最近更新
01
一些有意思的类比
06-16
02
the-super-tiny-compiler解析
06-06
03
计算机编译原理总概
06-06
更多文章>
Theme by Vdoing | Copyright © 2021-2022
蜀ICP备2021023197号-2
Simonzhans | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式
  • 飙升榜
  • 新歌榜
  • 云音乐民谣榜
  • 美国Billboard榜
  • UK排行榜周榜