web基础与http协议

一.HTML的基本概念

HTML(HyperText Markup Language)是一种用于创建和呈现Web页面结构的标记语言。HTML由一系列称为标签(tags)的元素组成,这些标签描述了页面上不同部分的内容和结构。以下是HTML的一些重要概述:

  1. 标签 :HTML文档由各种标签组成,每个标签用尖括号 < > 包围,例如<html><head><body>等。标签通常成对出现,包含一个开始标签和一个结束标签,如<p></p>

  2. 元素:开始标签、内容和结束标签一起构成一个完整的HTML元素。元素可以包含文本、图像、链接等内容,并定义了这些内容在页面中的呈现方式。

  3. 属性 :HTML标签可以包含属性,属性提供有关元素的额外信息。属性位于开始标签中,并以键值对的形式出现,如<img src="image.jpg" alt="Image">中的srcalt是属性。

  4. 结构 :HTML文档通常由<!DOCTYPE>声明、<html>元素、<head>元素和<body>元素组成。<!DOCTYPE>声明指定了文档类型,<html>元素是文档的根元素,<head>元素包含文档的元数据,而<body>元素包含可见内容。

  5. 标题 :通过<h1><h6>标签可以定义页面中不同级别的标题,其中<h1>表示最高级别标题,<h6>表示最低级别标题。

  6. 段落 :使用<p>标签可以定义段落,将文本块分隔开来,使其在页面上显示为单独的段落。

  7. 列表 :HTML支持有序列表(<ol>)、无序列表(<ul>)和定义列表(<dl>),可以用来呈现项目的有序性或关联性。

  8. 链接 :通过<a>标签可以创建超链接,将用户导航到其他页面或资源。<a>标签的href属性指定链接目标。

  9. 图像 :使用<img>标签可以插入图像到页面中,src属性指定图像的URL,alt属性提供替代文本。

  10. 表格 :HTML中的<table><tr><th><td>标签用于创建表格,展示数据以表格形式排列。

头部标签中常用的标签:

|------------|-------------------|
| 标签 | 描述 |
| <title> | 定义了文档的标题 |
| <base> | 定义了页面链接标签的默认链接地址 |
| <link> | 定义了一个文档和外部资源之间的关系 |
| meta> | 定义了HTML文档中的元数据 |
| <script> | 定义了客户端的脚本文件 |
| <style> | 定义了HTML文档的样式文件 |

内容标签中常用的标签:

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

HTML基本格式:

<html>
<head>网页的内容描述信息</head>
<body>网页显示的内容</body>
</html>

二.HTTP协议

1.http协议简要介绍

HTTP(Hypertext Transfer Protocol)是一种用于传输超文本的应用层协议,它是互联网上数据交换的基础。HTTP通过客户端和服务器之间的请求和响应来传输数据。

2.http协议版本间区别

  1. HTTP/0.9:最早的版本,于1991年诞生。它非常简单,只支持GET方法,并且响应只包含HTML文档,没有响应头等信息。不支持长链接

  2. HTTP/1.0:于1996年发布,引入了很多新特性,如请求方法的扩展(POST、HEAD等)、响应状态码、请求头和响应头等。不支持长链接

  3. HTTP/1.1:于1997年发布,是当前最常用的版本。相较于HTTP/1.0,HTTP/1.1引入了持久连接、管道化(pipelining)、分块传输编码(chunked transfer encoding)等特性,提高了性能和效率。支持长链接

3.http的请求方法

  • GET:请求指定的资源。
  • POST:向指定资源提交数据进行处理请求(例如提交表单或上传文件)。
  • PUT:上传指定的资源。
  • DELETE:删除指定的资源。
  • HEAD:类似于GET请求,但只返回响应头部,不返回实际内容。

(1)GET请求会向数据库发索取数据的请求,从而来获取信息,该请求不会产生副作用。无论进行多少次操作,结果都是一样的。

(2)与GET不同的是,PUT请求是向服务器端发送数据的,从而改变信息,无论进行多少次PUT操作,其结果并没有不同。

(3)POST请求同PUT请求类似,都是向服务器端发送数据的,但是该请求会改变数据的种类等资源,几乎目前所有的提交操作都是用POST请求的。

(4)DELETE请求顾名思义,就是用来删除某一个资源的。

4.http协议的状态码

1**(信息类):表示接收到请求并且继续处理

2**(响应成功):表示动作被成功接收、理解和接受

3**(重定向类):为了完成指定的动作,必须接受进一步处理

4**(客户端错误类):请求包含错误语法或不能正确执行

5**(服务端错误类):服务器不能正确执行一个正确的请求

http中常见的状态码:

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

5.URL介绍

统一资源定位符,用于描述某服务器某特定资源位置 资源的具体位置

完整格式:

<scheme>://<user>:<password>@<host>:<port>/<path>;<params>?<query>#<frag>   

scheme:方案,访问服务器以获取资源时要使用哪种协议 http https ftp file

user:用户,某些方案访问资源时需要的用户名

password:密码,用户对应的密码,中间用:分隔

Host:主机,资源宿主服务器的主机名或IP地址

port:端口,资源宿主服务器正在监听的端口号,很多方案有默认端口号

path:路径,服务器资源的本地名,由一个/将其与前面的URL组件分隔

params:参数,指定输入的参数,参数为名/值对,多个参数,用;分隔

query:查询,传递参数给程序,如数据库,用?分隔,多个查询用&分隔

frag:片段,一小片或一部分资源的名字,此组件在客户端使用,用#分隔

6.网站访问量

网站访问量统计的重要指标

IP(独立IP):即Internet Protocol,指独立IP数。一天内来自相同客户机IP 地址只计算一次,记录远程客户机IP地址的计算机访问网站的次数,是衡量网站流量的重要指标

PV(访问量): 即Page View, 页面浏览量或点击量,用户每次刷新即被计算一次,PV反映的是浏览某网站的页面数,PV与来访者的数量成正比,PV并不是页面的来访者数量,而是网站被访问的页面数量

UV(独立访客):即Unique Visitor,访问网站的一台电脑为一个访客。一天内相同的客户端只被计算一次。可以理解成访问某网站的电脑的数量。网站判断来访电脑的身份是通过cookies实现的。如果更换了IP后但不清除cookies,再访问相同网站,该网站的统计中UV数是不变的

7.http协议请求访问的完整过程

HTTP协议请求访问的完整过程通常包括以下步骤:

  1. 建立连接:客户端通过TCP/IP协议与服务器建立连接,通常使用HTTP默认的80端口或者加密的HTTPS的443端口。

  2. 接收请求:服务器接收到客户端发送的HTTP请求报文。

  3. 处理请求:服务器根据请求的URL、方法等信息进行处理,可能包括查找资源、执行业务逻辑等操作。

  4. 访问资源:服务器访问请求所需的资源,比如文件、数据库等。

  5. 构建响应报文:服务器根据请求处理的结果,构建HTTP响应报文,包括状态行、响应头部和可选的消息体。

  6. 发送响应报文:服务器将构建好的HTTP响应报文通过之前建立的TCP连接发送给客户端。

  7. 记录日志:服务器通常会记录请求的相关信息,比如请求时间、客户端IP地址、请求内容等,以便进行监控、分析和故障排查。

相关推荐
滚雪球~34 分钟前
npm error code ETIMEDOUT
前端·npm·node.js
沙漏无语35 分钟前
npm : 无法加载文件 D:\Nodejs\node_global\npm.ps1,因为在此系统上禁止运行脚本
前端·npm·node.js
supermapsupport37 分钟前
iClient3D for Cesium在Vue中快速实现场景卷帘
前端·vue.js·3d·cesium·supermap
brrdg_sefg38 分钟前
WEB 漏洞 - 文件包含漏洞深度解析
前端·网络·安全
胡西风_foxww1 小时前
【es6复习笔记】rest参数(7)
前端·笔记·es6·参数·rest
m0_748254881 小时前
vue+elementui实现下拉表格多选+搜索+分页+回显+全选2.0
前端·vue.js·elementui
唐 城1 小时前
curl 放弃对 Hyper Rust HTTP 后端的支持
开发语言·http·rust
星就前端叭2 小时前
【开源】一款基于Vue3 + WebRTC + Node + SRS + FFmpeg搭建的直播间项目
前端·后端·开源·webrtc
m0_748234522 小时前
前端Vue3字体优化三部曲(webFont、font-spider、spa-font-spider-webpack-plugin)
前端·webpack·node.js
Web阿成2 小时前
3.学习webpack配置 尝试打包ts文件
前端·学习·webpack·typescript