一篇文章看懂HTTP+WebSocket+计算机网络（附思维导图）

最新推荐文章于 2024-05-30 08:05:12 发布
最新推荐文章于 2024-05-30 08:05:12 发布
阅读量1.9k 收藏 3
点赞数 2
分类专栏： 计算机网络 文章标签： http websocket 网络
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43960657/article/details/121892952
版权

HTTP协议

  • HTTP协议
  • 协议简介

HTTP 超文本传输协议，是基于TCP/IP协议之上的应用层协议。

特点：

基于请求-响应的模式。

无状态保存：不保存之前发送过的请求或响应，为了实现保存功能引入了cookie。

无连接：服务器处理完客户的请求，并收到客户的应答后，即断开连接。HTTP1.0是直接断开，1.1就是长连接机制。

  • HTTP的请求方法
  1. HTTP有几种请求方法？

一共有八种方法，以不同的方式操作资源：

GET：发出获取资源的请求，只用在读取数据。

POST：提交数据，创建或修改资源。

PUT：只能修改已有字段的资源。

DELETE：删除Request—URI所表示的资源。

HEAD：发出资源请求，服务器不传回资源的文本部分。

TRACE：回显服务器收到的请求，用于测试或诊断。

OPTIONS：使服务器传回该资源所支持的所有HTTP请求的方法，可在CORS跨域资源共享时测试是否有访问权限。

CONNECT：通常用于SSL加密服务器的链接，管道方式的连接

  1. GET与POST的区别？

数据存放位置：GET放在URL中（请求行）。POST放在请求体中。

数据限制：GET数据大小有限制（URL长度限制，IE最小为2083字节），POST没有。

安全性：GET安全性低，会被保存在历史记录中。

  1. PUT与POST的区别？

PUT是更新数据，因为PUT是幂等的，幂等就是如果两个请求相同，后一个请求会把第一个请求覆盖掉。而POST则不是幂等的，他是新增数据。

 

  • 常见的HTTP请求头

Accept

浏览器能够处理的内容类型

Accept-Charset

浏览器能够显示的字符集

Accept-Encoding

浏览器能够处理的压缩编码

Accept-Language

浏览器当前设置的语言

Connection

浏览器与服务器之间连接的类型

Cookie

当前页面设置的任何Cookie

Host

发出请求的页面所在的域

Referer

发出请求的页面的URL

User-Agent

浏览器的用户代理字符串

  • 常见的HTTP响应头

Date

rfc822格式表示消息发送的时间

server

服务器名称

Connection

连接的类型

Cache-Control

控制HTTP缓存

content-type

后面的文档属于什么MIME类型

常见的Content-Type 属性值有以下四种：

（1）application/x-www-form-urlencoded：浏览器的原生form表单，按照key=val&的方式进行URI转码。

（2）multipart/form-data：通常表单POST上传文件时使用该方式。

（3）application/json：服务器消息主体是序列化后的JSON字符串。

（4）text/xml：主要用来提交XML格式的数据。

 

五、HTTP迭代

1、HTTP1.0到HTTP1.1的区别？

①引入长连接机制

1.0是一个请求响应后就马上关闭TCP连接。而1.1则基于TCP长连接机制（传输层才需要建立连接），一般几十秒内没有操作才断开连接。这样避免了频繁的三次握手和四次挥手，建立和关闭TCP连接带来的开销和时延。

②管道机制实现同时发送多个HTTP请求

1.0一个请求发送后，必须等待响应才能发送下一个请求，而1.1可以同时发送多个请求，节约等待时长。

③分块传输

1.0是content-length确定响应体长度。但数据过大或不断增大，则无法准确知道内容长度大小。1.1则采用流模式分块传输，每个数据块前指明大小，最后一个0表示结束。

④断点传输

1.1将已传输的部分写入临时文件.temp/.download，当网络断开重连，HTTP请求报文中会添加已经传输部分的长度。

2、HTTP1.1到HTTP2.0的区别？

①二进制

1.1请求体可以是不同的格式，其他是文本形式，2.0则是完全的二进制格式，即帧。

②I/O多路复用

2.0以前因为浏览器限制了同一个域名下的请求数量，页面要请求很多资源时会有队头阻塞的情况，而2.0基于二进制分帧可以同时交错的发送和请求数据，再重新组装。

③服务器推送

2.0服务端可以对一个客户端请求发出多个响应，预计需求推送额外的资源给客户端，这样可以减少请求的次数，提高页面响应速度。

④头信息压缩

1.1每次都要传输一样的请求字段（如cookie）。2.0将头信息压缩后再传输，且服务器和客户端同时维护一张头信息表，只发送索引即可。

3、页面有多张图片，HTTP是怎么加载的？

HTTP1，浏览器对同域名最大TCP连接数为6，所以会请求多次。可以多域名部署解决。

HTTP2支持多路复用，可以在一个TCP里发送多个HTTP请求，一瞬间加载很多资源。

 

六、HTTPS和HTTP

HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议。

HTTPS和HTTP的区别主要如下：

1、HTTPS协议需要到ca申请证书，需要一定费用。

2、HTTP信息是明文传输，HTTPS则是具有安全性的SSL加密传输协议，更安全。

3、HTTP是80端口，HTTPS是443。

七、HTTP状态码

1xx

请求正在处理

2xx

请求正常处理完毕

200

正常处理

204

正常处理但无需服务端返回内容

206

响应指定范围的实体内容

3xx

重定向

301

永久重定向，已分配新的URI

302

临时重定向，资源临时被分配了新的 URI

303

资源存在着另一个 URI，应使用GET方法获取资源

304

告诉客户端可以直接使用缓存的内容

307

临时重定向，保持方法不变重新请求新URI

4xx

客户端错误码

400

请求报文中存在语法错误

401

需要有通过HTTP认证的认证信息

403

请求资源的访问被服务器拒绝了

404

服务器上无法找到请求的资源

405

服务器禁止使用该请求方法

5xx

服务器错误状态码

500

服务器执行时发生错误

502

网关或代理服务器错误

503

服务器暂时超负荷或正在停机维修

504

超时未得到响应

304多好还是少好？

304优点：提高网站访问速度，对有缓存的页面直接使用缓存。

304多缺点：内容源更新频繁的页面，搜索引擎蜘蛛抓取频率更高，访问量更多。

八、WebSocket

是H5提供的一种浏览器与服务器进行全双工通信的网络技术，基于TCP连接，只需要完成一次握手后就能创建持久性的连接，且双向数据传输。即服务器和客户端都可以向对方主动推送消息。没有同源限制，协议标识符是ws/wss。

计算机网络

计算机网络模型

ISO为了更好的使网络应用更为普及，推出了OSI参考模型

ISO

TCP/IP

作用

举例

应用层

应用层

为应用程序提供服务

HTTP/HTTPS/FTP

表示层

数据加密、编码和转换

base64对数据编码

会话层

建立、管理和维护会话

单工、半双工和全双工

传输层

传输层

端到端的连接

TCP/UDP，端口号

网络层

网络层

IP寻址及路由选择

IP寻址建立两个节点之间的连接

数据链路层

数据链路层

组帧、物理编址

物理层

物理层

物理层

TCP的三次握手和四次挥手？

TCP三次握手：客户端向服务器发送SYN，服务端返回 SYN ACK ，客户端再发送ACK。

TCP四次挥手：客户端向服务器发送连接释放请求，服务器接收后返回ACK确定包。但因为TCP连接是双向的，如果此时服务端还有数据没发完，会继续发送数据，结束后向客户端发送连接释放请求，客户端收到后发送ACK应答。

为什么建立连接只要三次而关闭连接却要四次？

因为服务端LISTEN状态下，当收到SYN报文的建连请求后，它可以把ACK和SYN（ACK起应答作用，而SYN起同步作用）放在一个报文里来发送。但关闭连接时，当收到对方的FIN报文通知时，它仅仅表示对方没有数据发送给你了；但未必你所有的数据都全部发送给对方了，你可能还需要发送一些数据给对方之后，再发送FIN报文给对方来表示你同意可以关闭连接了，所以它这里的ACK报文和FIN报文多数情况下都是分开发送的。

TCP和UDP的区别

UDP无连接，不可靠传输，可同时对多个设备通信，适用于实时应用，例如视频会议。

TCP有连接，可靠传输（流浪控制、拥塞控制），只能一对一，适用于可靠的文件传输。

DNS解析过程

首先在浏览器缓存中查找对应的IP地址，若无进行下一步。

向本地DNS服务器发送请求，若本地DNS服务器有缓存则返回，没有则下一步。

本地DNS服务器分别向根域名服务器->顶级域名服务器->权威域名服务器发送请求，获取到IP地址后保存在缓存中，同时将结果返回给浏览器。

MaiOvv
关注
  • 2
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
WinHTTP WebSocket 代码
05-08
HTML 5 Web Sockets is a powerful and effective technique for real-time information processing. There exists many techniques such as Poling, Long Poling and Streaming that are said to be better earier days. With web sockets, it shows a better outcome for the end user as well as a proper utilization of the server bandwidth. WebSocket is a web technology providing full-duplex communications channels over a single TCP connection. The WebSocket protocol was standardized by the IETF as RFC 6455 in 2011, and the WebSocket API for in Web IDL is being standardized by the W3C.WebSocket is designed to be implemented in web browsers and web servers, but it can be used by any client or server application. The WebSocket Protocol is an independent TCP-based protocol. Its only relationship to HTTP is that its handshake is interpreted by HTTP servers as an Upgrade request. The WebSocket protocol makes possible more interaction between a browser and a web site, facilitating live content and the creation of real-time games. This is made possible by providing a standardized way for the server to send content to the browser without being solicited by the client, and allowing for messages to be passed back and forth while keeping the connection open. In this way a two-way (bi-directional) ongoing conversation can take place between a browser and the server. A similar effect has been achieved in non-standardized ways using stop-gap technologies such as Comet.In addition, the communications are done over TCP port number 80, which is of benefit for those environments which block non-standard Internet connections using a firewall. WebSocket protocol is currently supported in several browsers including Google Chrome, Internet Explorer, Firefox, Safari and Opera. WebSocket also requires web applications on the server to support it. Here goes a comparison of polling vs Web Sockets.
webSocket(1)---概述
猿累人生
10-27 641
1、使用场景 社区聊天、弹幕、多玩家游戏、协同编辑、股票基金实时报价、体育实况更新、基于位置的应用、在线教育、在线客服等需要实时数据通讯的场景。   2、软件体系结构 分为B/S和C/S两种 C/S：即client/server模式,传统运用比较广泛的软件体系结构,如qq、yy等需要用户安装客户端。 B/S：即Browser/Server模式,当前应用比较广泛的体系结构,基于浏览器建立...
深入解析HTTP方法与路由响应
最新发布
anananajiushiwo的博客
05-30 816
在构建网络应用时，HTTP方法扮演着至关重要的角色。通过理解HTTP的常见方法，如GET和POST，我们能够更有效地处理外部应用发出的请求。本节将详细介绍这两种HTTP方法，并展示它们在网络通信中的应用。通过深入理解HTTP方法和路由响应的处理机制，我们能够更加高效地构建网络应用。在实际开发中，我们需要根据具体需求选择合适的HTTP方法，并在路由中定义相应的处理函数来处理客户端发出的请求。同时，我们还需要注意保护用户隐私和数据安全，确保网络通信的可靠性和稳定性。👇热门内容👇。
两图看懂websocket和http的区别，websocket如何通过Http get方法创建
katerdaisy的博客
11-14 1791
不同于http. WebSocket只要一次握手成功，后续就可以不断的收发数据（在程序设计中，这种设计叫做回调），客户端也不用一直查询服务器状态等信息，只需要等服务器主动发送数据过来就可以了。
如何用http+websocket创建一个简单的聊天室
qq_46063425的博客
07-29 1013
如何用http+websocket创建一个简单的聊天室 了解一下什么是websocket？？？ websocket 是一种在单个TCP链接上进行双全共通信的协议。 对于通信协议大家可能第一时间想到就是HTTP协议，这里大家就会有一个疑问，我们已经学过了HTTP通信协议为什么还要来学习websocket呢？？ 嘿嘿，因为HTTP协议有一个缺陷，它的通信依赖于客户端用户的发起请求，然后服务器才能响应请求。而websocket协议弥补了这一个缺陷，它是双全通信，它的通信可以是客户端发起，也可以是服务器发起推送。
webSocket（与http请求区别、请求和返回示例、替代方法：ajax轮询、long poll、Flash、NodeJS实现WebSocket通信代码、原理、WebSocket构造函数详解）
AIWWY的博客
11-30 8444
简介 WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。 允许服务端主动向客户端推送数据。在 WebSocket API 中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。 替代方法 Ajax 轮询 现在，很多网站为了实现推送技术，所用的技术都是 Ajax 轮询。轮询是在特定的的时间间隔（如每1秒），由浏览器对服务器发出HTTP请求，然后由服务器返回最新的数据给客户端的浏览器。这种传统的模式带来很明显的缺点，即
java开发基于SpringBoot+WebSocket+Redis分布式即时通讯群聊系统.zip
06-24
Java开发基于SpringBoot+WebSocket+Redis分布式即时通讯群聊系统。一个基于Spring Boot + WebSocket + Redis，可快速开发的分布式即时通讯群聊系统。适用于直播间聊天、游戏内聊天、客服聊天等临时性群聊场景。 ...
PHP用swoole+websocket和redis实现web一对一聊天
10-16
**Swoole** 是一个高性能的PHP扩展，它提供了异步多线程、事件驱动的网络通信框架，使PHP能够处理TCP、UDP、HTTP、HTTPS、WebSocket等协议的服务器端和客户端应用。 **WebSocket** 是一种在客户端和服务器之间建立...
springboot+websocket进度条实战
11-11
在本项目中，"springboot+websocket进度条实战"是一个基于Spring Boot框架和WebSocket技术的实战应用，旨在展示如何在Web应用程序中实现一个实时的进度条功能。Spring Boot简化了Java Web开发，提供了快速构建独立...
spring+springMVC+WebSocket 的学习笔记
10-15
WebSocket 是一种在客户端和服务器之间建立长连接的协议，它允许双方进行双向通信，即服务器可以主动向客户端推送数据。相较于传统的 HTTP 协议，WebSocket 提供更低的延迟和更高的效率，尤其适用于实时通信应用，如...
springboot + jwt + websocket + 拦截
09-02
在IT行业中，Spring Boot、JWT（JSON Web Token）和WebSocket是三个非常重要的技术概念，而“拦截”通常指的是在系统中实现的一种中间件机制，用于处理请求或响应。结合提供的标题和描述，我们可以深入探讨这四个...
ws和http如何共同部署
混世小妲己
06-16 4689
websocket和http共享端口实现
【websocket前后端交互】vue-springboot实现websocket前后端交互链接，websocket心跳重连，包含前后端代码，复制即可用【详细解释版本】
seeeeeeeeeee的博客
05-10 6484
前言： 还是老规矩，一步步的教大家如何建立前后端的 websocket 链接，并能完成互相传送数据的简单功能。由于网上找了半天发现很多帖子都是东一句西一句的，要不就是写的没什么注释和解释，导致我这个前端人员看后端代码非常折磨。 但是，总算慢慢摸索给整出来了，那现在我就把一个详细版的，用前端小伙伴也听得懂的大白话来说一下如何实现 websocket 功能。 效果图 文档说明 前端代码部分 防止有后端小伙伴想写个前端代码的，不知道写哪里。我给个结构图 代码直接复制，然后再views内创建一个vue文件
http 和 websocket
珍妮的小罐君
04-24 331
前端时间在做项目的时候遇到这样的一个场景：网页中有一个数据表格，这个数据表格数据表格的内容是从后台读取出来的，但是这些内容会随着时间的变化而变化，有点类似于股票行情。当时我的做法是用setInterval('toPage(1)',1000)来定时执行函数,toPage()方法是通过ajax请求访问服务器，并在成功后拿到后台返回的数据然后去更新页面。但是这种定时的方法有很多不足：（1）频繁的网络请求...
http协议和websocket协议
weixin_66059613的博客
12-13 1534
http协议和websocket协议
HTTP与WebSocket比较
RichardGeek的博客
07-18 8062
HTTP: 1，无状态协议。 2，短连接。（Ajax轮询方式或Long  poll方式实现“持久连接”状态） 2，被动型。  客户端请求->服务器端响应。服务端不能主动联系客户端，只能有客户端发起。 WebSocket: 它解决了HTTP的这几个难题。 如被动性，当服务器完成协议升级后（HTTP->Websocket），服务端就可以主动推送信息给客户端啦。 就变成了这样，只...
WebSocket学习
weixin_49107940的博客
04-21 820
一、简介 WebSocket 是一种网络通信协议。RFC6455 定义了它的通信标准。 WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。 HTTP 协议是一种无状态的、无连接的、单向的应用层协议。它采用了请求/响应模型。通信请求只能由客户端发起，服务端对请求做出应答处理。 这种通信模型有一个弊端：HTTP 协议无法实现服务器主动向客户端发起消息。 这种单向请求的特点，注定了如果服务器有连续的状态变化，客户端要获知就非常麻烦。大多数 Web 应用程序将通过频繁的异
通过HTTP请求Websocket
热门推荐
Admin
12-30 1万+
原理：客户端B(Client/Browser)通过websocket向服务端S发起连接，服务端保存这个websocket连接。当浏览器A(Browser)向服务端发起HTTP请求时，服务端S接收HTTP请求并通过websocket向客户端B返回消息。 流程图： 客户端B的代码：用html实现，用于发送websocket请求和接收。 <!DOCTYPE html> <...
前后端实时通信-websocketd
bxr的博客
09-16 685
websocletd官网 websocketd服务器下载地址 下载对应版本 从websocketd版本页面下载特定于平台的存档 将文件提取到您选择的文件夹中或仅提取可执行文件 将websocketd的位置添加到PATH变量中 （以安装matlab为例）在 Linux CentOS 系统上安装完 MATLAB 后，为了使用方便，需要将 matlab 命令加到系统命令中，如果在没有添加到环境变量之前，执行“matlab”命令时，则会提示命令不存在的错误，如下所示： 下面我详细介绍
编写一个 JAVA+VUE+WebSocket的代码
06-07
以下是一个简单的 Java Vue WebSocket 应用程序的示例代码，其中使用了 Spring Boot 作为后端框架，前端使用 Vue.js。这个应用程序将向客户端发送一个简单的问候语，并且可以在客户端发送消息时回显该消息。 Java 代码： ```java package com.example.websocketdemo; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; import org.springframework.context.annotation.Bean; import org.springframework.web.socket.config.annotation.EnableWebSocket; import org.springframework.web.socket.config.annotation.WebSocketConfigurer; import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry; import org.springframework.web.socket.server.standard.ServerEndpointExporter; @SpringBootApplication @EnableWebSocket public class WebsocketDemoApplication implements WebSocketConfigurer { public static void main(String[] args) { SpringApplication.run(WebsocketDemoApplication.class, args); } @Bean public ServerEndpointExporter serverEndpointExporter() { return new ServerEndpointExporter(); } @Override public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) { registry.addHandler(new WebSocketHandler(), "/websocket").setAllowedOrigins("*"); } } ``` Vue.js 代码： ```html <template> <div> <h1>{{ message }}</h1> <input type="text" v-model="inputMessage" @keyup.enter="sendMessage"> </div> </template> <script> import { WebSocketClient } from 'vue-native-websocket' export default { name: 'App', data: () => ({ message: '', inputMessage: '' }), mounted () { this.websocket = new WebSocketClient('ws://localhost:8080/websocket') this.websocket.onMessage(this.handleMessage) }, methods: { handleMessage (data) { this.message = data }, sendMessage () { this.websocket.send(this.inputMessage) this.inputMessage = '' } } } </script> ``` WebSocket 处理程序代码： ```java package com.example.websocketdemo; import java.io.IOException; import javax.websocket.OnMessage; import javax.websocket.Session; import javax.websocket.server.ServerEndpoint; @ServerEndpoint("/websocket") public class WebSocketHandler { @OnMessage public void onMessage(String message, Session session) throws IOException { session.getBasicRemote().sendText("Hello, " + message); } } ``` 这个示例程序使用了 Spring Boot 和 Vue.js，其中后端的 WebSocket 处理程序使用了 Java WebSocket API，前端使用了 vue-native-websocket 库。运行这个应用程序，可以在浏览器中打开应用程序的 URL，输入一些文本并按下 Enter 键，可以看到服务器回显这个文本。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值