记录:post通常代表新增,put通常代表修改
HTTP协议在前端开发中的应用
- 工具
- HTTP协议实现的过程
- HTTP协议的含义及格式
1.调试工具
首先,前端开发的一个很重要的工具就是chrome浏览器。其实像火狐浏览器也很很好的调试工具,但我更喜欢使用chrome的。
按下F12就能调出这个管理控制台。
点击Network后就会出现所有的网络请求。
当我点击其中一个网络请求时,可以点击它的header来获取它的头信息。
其中包含了general,response headers和request header。
2.HTTP协议实现的过程
当点击进行跳转的时候浏览器到底发生了什么?
当点击跳转时,客户端(也就是我的浏览器)发送了一个http request请求,然后请求到了web服务器后,它会根据你输入的url进行资源定位,也就是传说中的路由。然后web服务器根据url定位到后再发送一个response,告诉我定位的结果及我需要的内容。
当然在客户端与服务端进行http请求时,率先进行了tcp链接的操作。
浏览器先给web服务器发送tcp连接。连接后,浏览器再给web服务器发送request请求。然后web服务器给浏览器发送response请求。最后他们的tcp连接完成,断开连接。所以每次请求都是先进行tcp连接再进行http请求和响应。
3.HTTP协议的含义及格式
url解析
url就是统一资源定位器。也就是网络请求的地址。它住在这个地方,我们根据它给我们的地址去找它。
http代表我们用的是哪个协议。目前还有https协议也比较多。
这个localhost表示的是host name,就是它住在哪个房子里。
8888代表的是端口。就是它在这个房子的哪一层里。当然端口并不是必须要写的,因为不写它会有一个默认端口,80。
后面的/hello表示路径,表示你在这一层的哪个房间,房间里的哪一个人。
就这样,web服务器就能根据url找到我们想要的东西了。
request解析
一般的http请求包含以下三部分:请求行、消息报头、请求正文。
第一行:GET / HTTP/1.1
GET表示一个读取请求,将从服务器获得网页数据,/表示URL的路径,URL总是以/开头,/就表示首页,最后的HTTP/1.1指示采用的HTTP协议版本是1.1。目前HTTP协议的版本就是1.1,但是大部分服务器也支持1.0版本,主要区别在于1.1版本允许多个HTTP请求复用一个TCP连接,以加快传输速度。
从第二行开始,每一行都类似于Xxx: abcdefg:
第二行:www.sina.com.cn
代表的是请求的域名。
response 解析
HTTP响应分为Header和Body两部分(Body是可选项),我们在Network中看到的Header最重要的几行如下:
HTTP/1.1 200 OK
- 1
200表示一个成功的响应状态,后面的OK是说明。失败的响应有404 Not Found:网页不存在,500 Internal Server Error:服务器内部出错,等等。其他还有304表示读取缓存,301,302表示资源重定向。
Content-Type:text/html
- 1
Content-Type
指示响应的内容,这里是text/html
表示HTML网页。请注意,浏览器就是依靠Content-Type
来判断响应的内容是网页还是图片,是视频还是音乐。浏览器并不靠URL来判断响应的内容,所以,即使URL是http://example.com/abc.jpg,它也不一定就是图片。
post和get方法的区别
请求方法(所有方法全为大写)有多种,各个方法的解释如下:
GET 请求获取Request-URI所标识的资源
POST 在Request-URI所标识的资源后附加新的数据
HEAD 请求获取由Request-URI所标识的资源的响应消息报头
PUT 请求服务器存储一个资源,并用Request-URI作为其标识
DELETE 请求服务器删除Request-URI所标识的资源
TRACE 请求服务器回送收到的请求信息,主要用于测试或诊断
CONNECT 保留将来使用
OPTIONS 请求查询服务器的性能,或者查询与资源相关的选项和需求
GET和POST的主要区别在于GET一般没有请求体,请求的时候不会带数据。所以当数据量少或不需要传数据的时候可以用GET。而POST一般会有请求体,一般数据较多的时候会使用POST。
HTTP协议在前端开发中的应用
- 工具
- HTTP协议实现的过程
- HTTP协议的含义及格式
调试工具
首先,前端开发的一个很重要的工具就是chrome浏览器。其实像火狐浏览器也很很好的调试工具,但我更喜欢使用chrome的。
按下F12就能调出这个管理控制台。
点击Network后就会出现所有的网络请求。
当我点击其中一个网络请求时,可以点击它的header来获取它的头信息。
其中包含了general,response headers和request header。
HTTP协议实现的过程
当点击进行跳转的时候浏览器到底发生了什么?
当点击跳转时,客户端(也就是我的浏览器)发送了一个http request请求,然后请求到了web服务器后,它会根据你输入的url进行资源定位,也就是传说中的路由。然后web服务器根据url定位到后再发送一个response,告诉我定位的结果及我需要的内容。
当然在客户端与服务端进行http请求时,率先进行了tcp链接的操作。
浏览器先给web服务器发送tcp连接。连接后,浏览器再给web服务器发送request请求。然后web服务器给浏览器发送response请求。最后他们的tcp连接完成,断开连接。所以每次请求都是先进行tcp连接再进行http请求和响应。
HTTP协议的含义及格式
url解析
url就是统一资源定位器。也就是网络请求的地址。它住在这个地方,我们根据它给我们的地址去找它。
http代表我们用的是哪个协议。目前还有https协议也比较多。
这个localhost表示的是host name,就是它住在哪个房子里。
8888代表的是端口。就是它在这个房子的哪一层里。当然端口并不是必须要写的,因为不写它会有一个默认端口,80。
后面的/hello表示路径,表示你在这一层的哪个房间,房间里的哪一个人。
就这样,web服务器就能根据url找到我们想要的东西了。
request解析
一般的http请求包含以下三部分:请求行、消息报头、请求正文。
第一行:GET / HTTP/1.1
GET表示一个读取请求,将从服务器获得网页数据,/表示URL的路径,URL总是以/开头,/就表示首页,最后的HTTP/1.1指示采用的HTTP协议版本是1.1。目前HTTP协议的版本就是1.1,但是大部分服务器也支持1.0版本,主要区别在于1.1版本允许多个HTTP请求复用一个TCP连接,以加快传输速度。
从第二行开始,每一行都类似于Xxx: abcdefg:
第二行:www.sina.com.cn
代表的是请求的域名。
response 解析
HTTP响应分为Header和Body两部分(Body是可选项),我们在Network中看到的Header最重要的几行如下:
HTTP/1.1 200 OK
- 1
200表示一个成功的响应状态,后面的OK是说明。失败的响应有404 Not Found:网页不存在,500 Internal Server Error:服务器内部出错,等等。其他还有304表示读取缓存,301,302表示资源重定向。
Content-Type:text/html
- 1
Content-Type
指示响应的内容,这里是text/html
表示HTML网页。请注意,浏览器就是依靠Content-Type
来判断响应的内容是网页还是图片,是视频还是音乐。浏览器并不靠URL来判断响应的内容,所以,即使URL是http://example.com/abc.jpg,它也不一定就是图片。
post和get方法的区别
请求方法(所有方法全为大写)有多种,各个方法的解释如下:
GET 请求获取Request-URI所标识的资源
POST 在Request-URI所标识的资源后附加新的数据
HEAD 请求获取由Request-URI所标识的资源的响应消息报头
PUT 请求服务器存储一个资源,并用Request-URI作为其标识
DELETE 请求服务器删除Request-URI所标识的资源
TRACE 请求服务器回送收到的请求信息,主要用于测试或诊断
CONNECT 保留将来使用
OPTIONS 请求查询服务器的性能,或者查询与资源相关的选项和需求
GET和POST的主要区别在于GET一般没有请求体,请求的时候不会带数据。所以当数据量少或不需要传数据的时候可以用GET。而POST一般会有请求体,一般数据较多的时候会使用POST。