Web基础与HTTP协议

一、web基础

web:通俗地说就是我们所说的网页,打开网站展示的页面。(专业地说:全球广域网,万维网,world wide web)

1.1 分布式图形信息系统

分布式:计算机系统或者应用程序分布在多台独立的计算机或者服务器上。通过计算机网络互相通信和协作,共同完成任务,或者共同对外提供一致的服务。分布式设计的目标:把工作负载分散 到多个节点上。每个节点既是属于一个整体,也是一个独立的运行体。这种设计提供了高可用架构,允许分布式节点的服务器出现故障。

集群:集群建立在分布式的基础之上,把多台计算机或者服务器连接在一起,作为一个整体,形成一个单一的计算资源 。也是通过网络连接,共享任务和资源负载,实现高性能高可用。同一集群中的计算机或者服务器性能基本一致,运行的服务或者应用程序都一致。

集群的目标:集群可以通过增加节点和减少节点实现弹性伸缩,提高处理能力和容量。

数据中心,web服务器都是处于集群、大数据处理等等。

1.2 web的组成结构

网页 :纯文本格式的一个文件,使用HTML语言(超文本标记语言)写成,是一种规范,也是一种标准。通过标记符号来显示网页中的各个部分。

一般来说,我们访问的页面,都是以.html或者.htm结尾,也是网站的首页。

浏览器把HTML语言进行翻译,形成用户看到的页面。

网站 :由多个页面组成,是一个网页的结合体。

域名 :访问网站或者浏览页面时输入的地址(网址)。

http \ https :用来传输网页的通信协议。是一种客户端和服务端之间通信、交互的标准和规范。

URL :万维网的寻址系统,是网站在互联网上的唯一标识。

超链接 :超链接由 <a> 元素定义,把网站中的不同网页连接起来。

发布 :把制作好的网页部署到互联网上,可以分为内和外。

  • 内部访问 :不提供互联网的对外访问,只能内部的局域网访问。
  • 外部访问 :互联网上公开的页面,所有人都可以访问的网页。

web1.0 :网页编辑好之后,用户直接阅读内容,用户无法对页面进行编辑、更改、创建其他内容。------单向的。

web2.0 :用户也是访问编辑好的页面,但是这个页面用户可以对其进行二次开发,包括分享、弹幕、点赞、送礼等等,都是web2.0的新特征。------开放的。

1.3 静态页面和动态页面

静态页面:

静态页面就是标准的HTML文件,文件的扩展名.html .htm

纯文本、图像、声音、动画组成的一个页面。

网站建设的基础,早期的网站都是静态页面,没有后台数据库,没有其他的程序,也没有可以交互的页面。

更新比较麻烦,适用于展示型的网站,或是更新内容比较少的网站。

静态页面的URL地址是固定的,且内容相对稳定,容易被搜索引擎检索到。

页面的浏览速度比较快,没有后台程序,不需要连接数据库,页面打开比较快。

动态页面:

动态页面的URL地址是不固定的,用户可以和后台进行交互(主要指数据库)。

动态页面的URL页面里有一个号。

动态页面使用的是PHP,JSP,Python,Ruby等语言。

动态页面的特点:

  • 交互性:用户可以对网站发布的页面进行二次开发。
  • 自动更新。
  • 页面的内容会实时地发生变化。

区别:

  • 静态页面:只能看
  • 动态页面:交互。

二、HTTP协议和返回码

HTTP:超文本传输协议

HTTPS:加密的超文本传输协议

2.1 HTTP协议

HTTP 0.9HTTP 1.0 基本淘汰,现在使用的主流是HTTP 1.1

HTTP 2.0 :是HTTP 1.1 的升级版,加密的协议,新一代的加密协议。

HTTP 1.0 和 HTTP 1.1 的区别

  1. 缓存机制
  • 缓存可以把用户的一些行为和操作保存下来,可以保留这些状态,不需要和web服务器进行额外的通信,提高了访问效率。
  • 缓存有的保存在本地,有的保存在web服务器,现在的缓存基本上保存在用户的本机(一般由浏览器保存)。
  • 缓存的保留时间,一般是30天到180天。一般的网站是30天左右。
  • HTTP 1.0 只有一种缓存策略, HTTP 1.1 引入了更多的缓存策略。
  1. 长连接

    HTTP 1.1 支持长连接,在一个TCP连接上可以传送多个HTTP请求和响应,可以一次性获取页面所有的内容。

  2. 带宽的优化和网络连接的使用

    HTTP 1.0 一次只能获取一个对象,其他对象还要继续建立连接获取数据。

    HTTP 1.1 只要建立了连接,除非数据发送完毕,否则不需要为了其他的资源专门再建立额外的连接,大大节省了带宽的使用。

2.2 HTTP的工作方式

  • 请求------------客户端发起
  • 响应------------服务端发起
2.2.1 请求

请求的方式:GET POST

请求的内容:

请求头:

请求体:

  • Accept:客户端获取的页面
  • Accept-Encoding :客户端可以接受的编码格式
  • Accept-Language :客户端可以接受的语言格式
  • Cache-Control :客户端需要缓存的时间
  • Connection: keep-alive :客户端通知服务端,服务端在数据传送完毕之后,不要马上关闭连接,让连接保持一段时间(60s,120s,180s)。
  • Host :表示客户端请求的IP和端口
  • User-Agent :客户端请求的工具,用什么浏览器发起请求,发起请求的系统是什么
  • 以及其他网页设置
2.2.2 响应

响应的内容:

响应头:响应体:

Connection: keep alive :响应客户端的连接方式

Content-Encoding :响应客户端的编码方式

Content-Type :响应客户端的类型,发送数据的类型

Date :响应发生的时间

Server : 使用web服务的软件和版本

Strict-Transport-Security :响应客户端的缓存时间

Request Method: GET :客户端的请求方式是get

Status Code :请求收到之后,服务端对请求的响应的状态码

  • 1xx :100-101 信息提示
  • 2xx :200-206 成功
  • 3xx :300-305 重定向和缓存
  • 4xx :400-415 客户端错误(客户端请求的内容或者页面不存在)
  • 5xx :500-505 服务端错误,web服务软件本身出了故障,无法响应

2.3 HTTP常见的状态码

200 :OK,请求成功

301 :永久重定向,请求的页面会永久跳转到其他的页面

302 :临时重定向,一般网站维护时使用

304 :访问的是本地缓存

403 :用户的请求禁止访问

404 :用户请求的网页不存在

500 :内部服务错误,一般是软件层面,也可能是硬件故障,也可能是防火墙

502 :Bad-Gateway,无效网关(一般是防火墙限制了转发功能)

503 :service unavailable,服务不可用

504 :Gateway timeout,网关请求超时

2.4 GET和POST

get就是向服务发送请求。请求不带任何参数,由http协议自行约定。

post也是发数据,也是依照http协议,post会改变服务器的数据。post之后在数据库中多了一条数据,或者对原数据进行了修改。

二者的区别:

  • get的请求可以被缓存,post没有缓存。
  • get的请求记录会保存在浏览记录(cookie),post不会被保存。
  • get就是获取数据,post会修改数据。
  • get的请求长度是有限制的,而且请求的字符串会显示在URL中。post的请求没有长度限制,而且字符串也不在URL中显示。

动态页面文件的后缀一般是 .jsp .js .php

相关推荐
不露声色丶18 分钟前
elementPlus表格二次封装
前端·javascript·vue.js
王天乐00721 分钟前
ElementUI的搭建
前端·javascript·elementui
OpenTiny社区27 分钟前
7月6日 VueConf 技术大会即将在深圳举办
前端·vue.js·github
隐藏用户y29 分钟前
探索如何赋予对象迭代魔法,轻松实现非传统解构赋值的艺术
前端·javascript
Zww089137 分钟前
css美化滚动条样式
前端·css·css3
Goat恶霸詹姆斯38 分钟前
uniapp实现图片懒加载 封装组件
前端·javascript·uni-app
佩淇呢42 分钟前
uniapp 使用vite构建项目
前端·vue.js·uni-app
专注成就自我42 分钟前
p标签文本段落中因编辑器换行引起的空格问题完美解决方案
前端·javascript·vue.js·编辑器·html
神明木佑1 小时前
js学习--隔行换色
前端·javascript·学习
阿垚啊1 小时前
vue属性绑定v-bind
前端·javascript·vue.js