HTML及HTTP协议

2022/6/12 23:24:57

本文主要是介绍HTML及HTTP协议,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

web服务的过程:

浏览器发请求 --> HTTP协议 --> 服务端接收请求 --> 服务端返回响应 --> 服务端把HTML文件内容发给浏览器 --> 浏览器渲染页面

一、HTML

1.什么是HTML?

  • 超文本标记语言(Hypertext Markup Language, HTML)是一种用于创建网页的标记语言(不是编程语言)。

  • 本质上是浏览器可识别的规则,我们按照规则写网页,浏览器根据规则渲染我们的网页。对于不同的浏览器,对同一个标签可能会有不同的解释。(兼容性问题)

  • 网页文件的扩展名:.html或.htm

     

2.HTML的语法规则

HTML标签采用双标记符的形式,前后标记符对应,分别表示标记开始和结束,标记符中间的内容被标签描述。

最基本的HTML文档:

<html>
<head>
  <title>网页标题</title>
</head>
<body>
</body>
</html>
  1. ​ 声明为HTML5文档。 ​
  2. <html>、</html>是文档的开始标记和结束的标记。是HTML页面的根元素,在它们之间是文档的头部(head)和主体(body)。

  3. <head>、</head>定义了HTML文档的开头部分。它们之间的内容不会在浏览器的文档窗口显示。包含了文档的元(meta)数据。

  4. ​ 定义了网页标题,在浏览器标题栏显示。 ​
  5. <body>、</body>之间的文本是可见的网页主体内容。

 

●头部常用标签:

标签意义
<title></title> 定义网页标题
<style></style> 定义内部样式表
<script></script> 定义JS代码或引入外部JS文件
<link/> 引入外部样式表文件
<meta/> 定义网页原信息

 

●主体常用标签:

标签意义
<table> 定义一个表格
<tr> 定义了表格中的一行
<td> 定义了表格中某一行的一列
<a> 定义了一个超链接
<p> 定义了一行
<img> 定义了一个图像
  换行
<font> 字体

3、静态网页与动态网页

静态网页:

(1)静态网页不能简单地理解成静止不动的网页,他主要指的是网页中没有程序代码,只有HTML(即:超文本标记语言),一般后缀为.html,.htm,或者.xml等。虽然静态网页的页面一旦做成,内容就不会再改变了。但是,静态网页也包括一些能动的部分,这些主要是一些GIF动画等

(2)静态网页的打开,用户可以直接双击,并且不管任何人任何时间打开的页面的内容都是不变的。

 

动态网页:

(1)动态网页是指跟静态网页相对的一种网页编程技术。动态网页的网页文件中除了HTML标记以外,还包括一些特定功能的程序代码,这些代码可以使得浏览器和服务器可以交互,所以服务器端根据客户的不同请求动态的生成网页内容。

即:动态网页相对于静态网页来说,页面代码虽然没有变,但是显示的内容却是可以随着时间、环境或者数据库操作的结果而发生改变的。

(2)动态网页,与网页上的各种动画、滚动字幕等视觉上的动态效果没有直接关系,动态网页也可以是纯文字内容的,也可以是包含各种动画的内容,这些只是网页具体内容的表现形式,无论网页是否具有动态效果,只要是采用了动态网站技术(如PHP、ASP、JSP等)生成的网页都可以称为动态网页。

动态网页和静态网页的区别:

(1)更新和维护:  

静态网页内容一经发布到网站服务器上,无论是否有用户访问,这些网页内容都是保存在网站服务器上的。如果要修改网页的内容,就必须修改其源代码,然后重新上传到服务器上。静态网页没有数据库的支持,当网站信息量很大的时候网页的制作和维护都很困难

动态网页可以根据不同的用户请求,时间或者环境的需求动态的生成不同的网页内容,并且动态网页一般以数据库技术为基础,可以大大降低网站维护的工作量

(2)交互性:

静态网页由于很多内容都是固定的,在功能方面有很大的限制,所以交互性较差

动态网页则可以实现更多的功能,如用户的登录、注册、查询等

(3)响应速度:

静态网页内容相对固定,容易被搜索引擎检索,且不需要连接数据库,因此响应速度较快

动态网页实际上并不是独立存在于服务器上的网页文件,只有当用户请求时服务器才返回一个完整的网页,其中涉及到数据的连接访问和查询等一系列过程,所以响应速度相对较慢

(4)访问特点:

静态网页的每个网页都有一个固定的URL,且网页URL以.htm、.html、.shtml等常见形式为后缀,而不含有“?”,可以直接双击打开

动态网页中的“?”对搜索引擎检索存在一定的问题,搜索引擎一般不可能从一个网站的数据库中访问全部网页,或者出于技术方面的考虑,搜索之中不去抓取网址中“?”后面的内容,不能直接双击打开

 

动态网页语言

目前常用的动态网页编程语言如下:

  1. PHP 即 Hypertext Preprocessor(超文本预处理器),是当今 Internet 上最为火热的脚本语言,语法借鉴了 C、Java、PERL 等语言。

  2. JSP 即 Java Server Pages(Java 服务器页面),是基于 Java Servlet 以及整个 Java 体系的 Web 开发技术。

  3. Python 是一种面向对象、跨平台的动态类计算机程序设计语言,最初被设计用于编写自动化脚本(shell),随着版本的不断更新和语言新功能的添加,越来越多被用于独立的大型项目开发。

  4. Ruby 是一种简单快捷的面向对象(面向对象程序设计)脚本语言,遵守GPL 协议和Ruby License。

 

二、HTTP 协议概述

1、HTTP的概念

客户端先是进行域名解析,然后再利用三次握手与服务器建立TCP连接。其次发送http请求,然后服务器进行回应。在断开连接时,若服务器发出的信号为Keepalive,则该连接会保持一段时间,再该时间内可继续接收请求。

HTTP 已经演化出了很多版本,它们中的大部分都是向下兼容的。 (1)HTTP/0.9:已过时。只接受 GET 一种请求方法,没有在通讯中指定版本号,且不支持请求头。由于该版本不支持 POST 方法,所以客户端无法向服务器传递太多信息。 (2)HTTP/1.0:这是第一个在通讯中指定版本号的 HTTP 协议版本,至今仍被广泛采用,特别是在代理服务器中。 (3)HTTP/1.1:当前版本。持久连接被默认采用,即TCP连接默认不关闭,可以被多个请求复用,并能很好地配合代理服务器工作。还支持以管道方式同时发送多个请求,以便降低线路负载,提高传输速度。

(4)HTTP/2.0:完全多路复用,在一个连接里,客户端和浏览器都可以同时发送多个请求和回应,而且不用按照顺序一一对应。引入头部信息压缩机制。支持服务端推送,允许服务器未经过请求,主动向客户端发送资源。

2、HTTP特点

1、简单快速:客户向服务器请求服务时,只需传送请求方法和路径。由于HTTP协议简单,使得HTTP服务器的程序规模小,因而通信速度很快。

2、灵活:HTTP允许传输任意类型的数据对象。正在传输的类型由Content-Type加以标记。

3、HTTP 0.9和1.0使用非持续连接:限制每次连接只处理一个请求,服务器处理完客户的请求,并收到客户的应答后,即断开连接。HTTP 1.1使用持续连接:不必为每个web对象创建一个新的连接,一个连接可以传送多个对象,采用这种方式可以节省传输时间。

4、无状态:HTTP协议是无状态协议。无状态是指协议对于事务处理没有记忆能力。缺少状态意味着如果后续处理需要前面的信息,则它必须重传,这样可能导致每次连接传送的数据量增大。另一方面,在服务器不需要先前信息时它的应答就较快。

5、支持B/S及C/S模式。

3、HTTP 请求方法

每条 HTTP 请求报文都包含一个方法, 告诉服务器要执行什么动作,包括:获取一个页面,运行一个网关程序,删除一个文件等。

最常用的获取资源的方法是 GET、POST。 GET 对服务器资源获取的简单请求 PUT 向服务器提交数据,以修改数据 DELETE 删除服务器上的某些资源 POST 用于发送包含用户提交数据的请求 HEAD 请求页面的首部,获取资源的元信息

4、HTTP 状态码

HTTP 状态码(HTTP Status Code)是用以表示网页服务器 HTTP 响应状态的 3 位数字代码,当浏览器请求某一 URL 时, 服务器根据处理情况返回相应的处理状态。

状态码首位已定义范围分类
1xx 100-101 信息提示
2xx 200-206 成功
3xx 300-305 重定向
4xx 400-415 客户端错误
5xx 500-505 服务器错误

HTTP 常见状态码

状态码功能描述
200 一切正常
301 永久重定向
302 临时重定向
401 用户名或密码错误
403 禁止访问(客户端IP地址被拒绝)
404 文件不存在
414 请求URI头部过长
500 服务器内部错误
502 无效网关
503 当前服务不可用
504 网关请求超时

 

消息类(1字头)

成功类(2字头)

200 (成功)服务器已成功处理了请求。 通常,这表示服务器提供了请求

201 (已创建) 请求成功并且服务器创建了新的资源。

202 (已接受) 服务器已接受请求,但尚未处理。

203 (非授权信息) 服务器已成功处理了请求,但返回的信息可能来自另一来源。

204 (无内容) 服务器成功处理了请求,但没有返回任何内容。

205 (重置内容) 服务器成功处理了请求,但没有返回任何内容。

206 (部分内容) 服务器成功处理了部分 GET 请求。

重定向类(3字头)

300 (多种选择) 针对请求,服务器可执行多种操作。 服务器可根据请求者 (user agent) 选择一项操作,或提供操作列表供请求者选择。

301 (永久移动) 请求的网页已永久移动到新位置。 服务器返回此响应(对 GET 或 HEAD 请求的响应)时,会自动将请求者转到新位置。

302 (临时移动) 服务器目前从不同位置的网页响应请求,但请求者应继续使用原有位置来进行以后的请求。

303 (查看其他位置) 请求者应当对不同的位置使用单独的 GET 请求来检索响应时,服务器返回此代码。

304 (未修改) 自从上次请求后,请求的网页未修改过。 服务器返回此响应时,不会返回网页内容。

305 (使用代理) 请求者只能使用代理访问请求的网页。 如果服务器返回此响应,还表示请求者应使用代理。

307 (临时重定向) 服务器目前从不同位置的网页响应请求,但请求者应继续使用原有位置来进行以后的请求。

请求错误类(4字头)

400 (错误请求) 服务器不理解请求的语法。

401 (未授权) 请求要求身份验证。 对于需要登录的网页,服务器可能返回此响应。

403 (禁止) 服务器拒绝请求。

404 (未找到) 服务器找不到请求的网页。

状态:404 Not Found

解释:请求的网页不存在

可能原因:

1、 nginx路由配置的不正确

2、 请求路径拼写不正确

405 (方法禁用) 禁用请求中指定的方法

状态:405 Not Allowed

解释:请求方式不被允许。比如delete请求 用post请求的话有时会出现

406 (不接受) 无法使用请求的内容特性响应请求的网页。

407 (需要代理授权) 此状态代码与 401(未授权)类似,但指定请求者应当授权使用代理。

408 (请求超时) 服务器等候请求时发生超时。

409 (冲突) 服务器在完成请求时发生冲突。 服务器必须在响应中包含有关冲突的信息。

410 (已删除) 如果请求的资源已永久删除,服务器就会返回此响应。

411 (需要有效长度) 服务器不接受不含有效内容长度标头字段的请求。

412 (未满足前提条件) 服务器未满足请求者在请求中设置的其中一个前提条件。

413 (请求实体过大) 服务器无法处理请求,因为请求实体过大,超出服务器的处理能力。

状态:413 Request Entity Too Large

解释:请求实体太大

可能原因:

1、nginx配置 client_max_body_size 过小导致

2、超过浏览器请求实体默认的最大值

414 (请求的 URI 过长) 请求的 URI(通常为网址)过长,服务器无法处理。

状态:414 Request-URI Too Large

解释:URL太大

可能原因:

1、 client_header_buffer_size 和 large_client_header_buffers配置过小

415 (不支持的媒体类型) 请求的格式不受请求页面的支持。

416 (请求范围不符合要求) 如果页面无法提供请求的范围,则服务器会返回此状态代码。

417 (未满足期望值) 服务器未满足”期望”请求标头字段的要求。

状态:499

解释:nginx返回过程中客户端失去连接

可能原因:

1、 并发过大

2、 下载或请求过程中断开客户端

服务器错误类(5、6字头)

500 (服务器内部错误) 服务器遇到错误,无法完成请求。

状态:500 HTTP-Internal Server Error

解释:服务器无法解析

可能原因:

1、 服务器压力过大,检查服务器吞吐量,内存CPU使用量,响应不到

2、 同事遇到过,做负载时前端文件版本不匹配也会报错500

3、 重放攻击攻击失效会返回500,不过除了做安全测试应该不会遇到这种情况

4、 系统内的500 OK错误的话,应该找开发看是不是程序错误,空指针之类的

5、 数据库服务、数据库存储空间等问题也会导致500错误,具体需要询问对应DBA

501 (尚未实施) 服务器不具备完成请求的功能。 例如,服务器无法识别请求方法时可能会返回此代码。

502 (错误网关) 服务器作为网关或代理,从上游服务器收到无效响应。

状态:502 Bad Gateway

解释:网关错误,502已经与后端建立了连接,但超时。Nginx已启动,但是Nginx路由的服务未启动,导致超时

可能原因:

1、 服务未启动或启动中,检查服务状态

2、 Nginx 请求响应时间配置过低,提高响应时间

503 (服务不可用) 服务器目前无法使用(由于超载或停机维护)。 通常,这只是暂时状态。

504 (网关超时) 服务器作为网关或代理,但是没有及时从上游服务器收到请求。

505 (HTTP 版本不受支持) 服务器不支持请求中所用的 HTTP 协议版本。

 

5、HTTP 请求流程

1.首先客户机与服务器需要建立连接。只要单击某个超级链接,HTTP的工作开始。

2.建立连接后,客户机发送一个请求给服务器

请求方式的格式为:统一资源标识符(URL)、协议版本号,后边是MIME信息包括请求修饰符、客户机信息和可能的内容。

3.服务器接到请求后,给予相应的响应信息,其格式为一个状态行,包括信息的协议版本号、一个成功或错误的代码,后边是MIME信息包括服务器信息、实体信息和可能的内容。 4.客户端接收服务器所返回的信息通过浏览器显示在用户的显示屏上,然后客户机与服务器断开连接。

请求报文

请求行:请求行由请求方法、URL 以及协议版本三部分组成,用来说明请求类型,要访问的资源以及所使用的HTTP版本。

请求头:请求头为请求报文添加了一些附加信息,由“名/值”对组成,每行一对,名和值之间使用冒号分隔,用来说明服务器要使用的附加信息。

空行:请求头部的最后会有一个空行,表示请求头部结束,接下来为请求体,这一行非常重要,必不可少。即使第四部分的请求数据为空,也必须有空行。

请求体:请求体是请求提交的参数,GET 方法已经在 URL 中指明了参数,所以提交时没有数据。POST 方法提交的参数在请求体中。

 

常用的请求头: Host 接受请求的服务器地址,可以是 IP:端口号,也可以是域名 User-Agent 发送请求的应用程序名称 Connection 指定与连接相关的属性,如 Connection:Keep-Alive Accept-Charset 通知服务端可以发送的编码格式 Accept-Encoding 通知服务端可以发送的数据压缩格式 Accept-Language 通知服务端可以发送的语言

 

响应报文

状态行:状态行由协议版本,状态码,状态码描述三部分组成。

响应头:响应头与请求头部类似,为响应报文添加了一些附加信息

空行:响应头部的最后会有一个空行,表示响应头部结束

响应体:服务器返回的相应 HTML 数据,浏览器对其解析后显示页面。

 

常见响应头: Server 服务器应用程序软件的名称和版本

Content-Type 响应正文的类型(是图片还是二进制字符串)

Content-Length 响应正文长度

Content-Charset 响应正文使用的编码

Content-Encoding 响应正文使用的数据压缩格式

Content-Language 响应正文使用的语言



这篇关于HTML及HTTP协议的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程