13、web——HTTP协议

目录

1.HTTP协议

1.如何表述我们请求哪个资源？

URL的具体格式

2.请求的格式

3.响应

1.请求的结果 （成功/失败，失败的原因是什么）

2.本次相应的元信息

3.本次资源的内容（如果有的话）

 2.具体的WEB服务器的使用（Tomcat)

1.在网页上使用tomcat

2.在IDEA中使用Tomcat

3.在Tomcat服务器的基础上

4.常见错误

---

1.HTTP协议

web是由一个或者多个Web资源共同组成的。

实际上，浏览器进程并不和web资源在同一台主机上。甚至这些web资源本身都不一定在同一台主机上。

 HTTP协议（超文本传输协议） hyper text transimission protocol ，它是应用层协议，工作中在TCP协议之上。

1.基于某个特定的传输层协议之上

2.描述业务

3.非OS的代码

它是一种文本协议：

1.对人类友好

2.对程序不友好，性能差

客户端（浏览器进程/postman）    服务器（Web服务器）

C -> S： 请求 request

S -> C:   响应response

HTTP协议以资源位基本单位——一次请求：浏览器进程向Web服务器请求一个Web资源

                                                一次响应：Web服务器进程，给回浏览器金成一个Web资源的内容 

一次HTTP请求-相应，完成一个Web资源的获取过程

---

1.如何表述我们请求哪个资源？

统一资源标识符 Unique Resource Identifer  URI

实际中，应用的是一种具体实现的URI，被称为统一资源定位 Unique Resource Location URL

URL的具体格式

完整的URL = 协议+主机+端口+资源路径+请求字符串+文档片段

1.资源在哪台主机上  ——域名domain 或者IP来体现——主机Host

2.和主机上的哪个进程去获取资源——端口port

3.具体定位到是该进程管理的哪个资源——资源路径path

4.需要标识出本次资源对应的协议protocol/schema

5.针对本次请求，除了资源本身之外的特殊要求，还需要

       （1）查询字符串 query string

         (2)文档片段 fragment

端口：基本上每种应用层协议都有其默认端口。当前的端口是这个默认端口时，可以省略该端口

    http默认端口：80   https: 443

路径：1.当文件名是index.html   index.php   index.jsp...，大部分的web服务器兼容不写文件名

            2.也有绝对路径 /相对路径

              绝对路径：以被web进程管理的资源的根目录为根

 ?   这是查询字符串query string,这个内容不是必须的，可以没有

    具体格式：     ？   一组或一个 key-value键值对，如果是多个，用'&'进行分割

                           ？name=mxj&age=18&gender=female

2.请求的格式

请求 = 请求行+请求头们+可能存在的请求体

            request line +request headers +request bady

请求行 =请求方法 +资源URL（一般省略路径）+请求版本

请求方法： GET（获取资源）、POST（发布资源）、其他（PUT、DELETE、CONNECT、OPTIONS)

请求头们：请求头\r\n请求头\r\n....请求头\r\n\r\n

3.响应

1.请求的结果 （成功/失败，失败的原因是什么）

    响应行= 响应版本+ 状态码+可能存在的响应码文字描述

响应码综述：

（1）  1XX    请求进行时

（2） 2XX  成功    200OK，表示请求/响应成功   206PartialOK,表示部分成功

（3）3XX   应用缓存/重定向

（4）4XX  失败了，问题出在客户端（客户端/用户）  404Not Found  405  Methord

（5）5XX  失败了，问题出在服务器（Web服务器/我们代码问题） 500Internal Sever Error

2.本次相应的元信息

3.本次资源的内容（如果有的话）

请求/响应头格式： Name:Value\r\n

常见响应头：  Context-Type、Content-Length

Context-Type:内容类型            请求体/响应体 的格式

                 内容是html              Context-Type:text/html

                                                 Context-Type:text/html;charset= utf-8

                  内容是CSS                                     text/css

                 JavaScript                                      application/javascript

                                                                         text/javascript

                 纯文本（无格式）                          text/plain

---

jpg图                                                                   image/jpeg

png                                                                      image/png

---

JSON格式                                                           {"key"： "value","k2","v2"}

Javascript Object Notation           key必须string ,value可以是数字、字符串、布尔、数组、对象 

JS对象记号法（JS表示对象的子集）             application/json          text/json

---

Content-Length:内容的长度   请求体/响应体的长度

TCP是面向字节流的。应用层协议设计时，需要自行考虑在协议中解包信息

---

 2.具体的WEB服务器的使用（Tomcat)

控制权反转：之前的代码，都是自己写main方法，但是会调用第三方库（别人的代码）控制权一直在我们手中。

Tomcat是别人写好的main方法，我们的代码是被Tomcat的代码反向控制的。

Tomca下面5个web应用

1.在网页上使用tomcat

如果要观察资源状况，首先要打开：

在浏览器中输入127.0.0.1:8080即可 ，然后就可以观察资源情况了：

请问访问此资源的路径是什么？

 由于Index.html的文件名可以省略，也可以写为 /blog/

2.在IDEA中使用Tomcat

1.如何创建一个web项目

设置如图所示的配置：

建立如图所示的结构： 

准备好一个资源，以src/main/webapp为资源的根目录。

如果放错了是打不开的，比如，

WEB-INF下面就不是放资源的，如果按照以下目录，是打不开的。 

Servlet下，一个资源的路径=Context Path(Application Path)+Servlet Path

---

静态资源：书就在书店，你来买，就给你一本

动态资源：现在没有你要的书，你来买，我就当场写一本给你

一般来说，html、css、js都是以静态资源处理为主。

3.在Tomcat服务器的基础上

1.在JS的ajax   要通过js代码来自己发送http请求

<a> <form>间接地引导浏览器发送HTTP请求

2.JS的功能：通过修改DOM树，进而影响用户看到的内容

1.要让浏览器通过Tomcat访问资源，而不是直接让浏览器打开资源

表现在URL:

http://127.0.0.1:8080/路径         浏览器在127.0.0.1主机上绑定的8080端口进行的进程通信（是tomcat)

2.资源的路径 =Context Path +Servlet Path  

Servlet Path相对于webapp的目录是啥

 4.具体使用方法：

某个.html，由于html中有<script src="..."></script>

使得浏览器自动请求...js资源，并且执行js的代码

在js代码中，由于我们执行了xhr的代码，会让浏览器发起请求"...json"的请求

当拿给数据时（响应完成），触发xhr对象load事件，导致函数被调用

在函数里，针对响应进行打印

5.常见错误

（1）浏览器无法建立到127.0.0.1:8080的TCP连接，很有可能是tomcat没有启动，可以尝试重启tomcat

（2）已经404了，说明Tomcat已经启动了

排查一下8080端口是否真的被tomcat监听了

或者资源路径写错了

也可以重启tomcat

资源不能放在 WEB-INF下面

还可能是相对路径位置不对

（3）页面白页或者没有按照预期显示

         1.使用开发者工具的元素界面，查看元素是否符合预期结构

         IDEA中自动保存不小心关了，所以写了没有保存

        保存之后index.html打包到另一目录下index.html

         浏览器有缓存功能，浏览器读取的还是老的Index.html

       2.如果我们的代码是由JS动态生成的

        控制台没有JS报错

       JS资源是不是200

        JS对了，检查JS的内容是不是最新的符合预期的

        检查ajax是不是200

 

         ajax的响应是否符合预期

          检查数据内容

6.实践

（1）Ajax的使用 提供JS可以发起HTTP请求的能力（同一个域名下才有权限）

XMLHttpRequest()对象的使用

open(method,url)    send()           onload = function(){...}

reponseText:响应体

(2)JS中如何解析JSON字符串：JSON.parse(jsonString)

ajax.html包含一个<script src ="js/script"></script>

js/script写了ajax代码，请求data/student.json资源

行为主体： 用户 浏览器（进程）   Tomcat（进程）

7.如何打包

 如图勾选，进行打包

看到下面这个页面，就说明打包成功

 最终的存储在如下位置，打包成一个war包(Web app ARchive)：