【學(xué)習(xí)打卡】第1天前后端交互

標(biāo)簽：

Html5

课程名称：前端工程师2022版、章节：前后端交互、讲师：Alex

课程内容：前后端数据交互与HTTP协议

前后端通信
- 前端向后端发送数据 --->用户注册
- 后端向前端发送数据 ---> 访问页面
- 前后端通信是前端和后端数据交互的过程即浏览器和服务器之间数据交互的过程
前后端通信的过程
- 前后端的通信是在‘请求-响应’中完成的
概念解释
- 后端：服务器端
- curl https:idcbgp.cn
- 命令行工具
- 客户端：只要能和服务器通信的就叫客户端
- 前端：浏览器端
前后端的通信方式
- 3.Ajax 和 Fetch
- 浏览器在解析 HTML 标签的时候，遇到一些特殊的标签，会再次向服务器发送请求，如 link/img/script/iframe
- 还有一些标签，浏览器解析的时候，不会向服务器发送请求，但是用户可以使用他们向服务器发送请求，如 a/form
- HTML 的标签
- 在浏览器地址栏输入网址，按下回车
- 使用浏览器访问网页
HTTP协议
- 超文本：原先一个个单一的文本，通过超链接将其联系起来。由原先的单一的文本变成了可无限延伸、扩展的超级文本、立体文本
- HTML：超文本标记语言
- HTTP ：HyperText Transfer Protocol（超文本传输协议）
HTTP 报文
- send方法发送的数据，是通过请求体携带的
- POST 请求，有请求体，数据通过请求体携带
- GET 请求，没有请求体，数据通过请求头携带
- HTTP 报文格式请求+ 请求头：起始行+首部+请求体
- 服务器向浏览器发送响应时传输的信息，叫响应报文
- 浏览器向服务器发送请求时，请求本身就是信息，叫请求报文
HTTP 方法
- 一种接口设计风格，充分利用 HTTP 方法的语义
- RESTful 接口设计
- GET 获取数据-->获取资源（文件）
- POST 创建数据--->注册
- PUT 更新数据 -->修改个人信息，修改密码
- DELETE 删除数据 ---> 删除一条评论
- 常用的 HTTP 方法增删改查
- 这些方法虽然有各自的语义，但是并不是强制性的
GET和POST方法对比
- 安全性：GET 和 POST 都不安全
- POST 既可以通过地址在请求头中携带数据，也可以通过请求体携带数据
- 能携带的数据量理论上是无限的
- POST 不会被缓存
- POST
- GET 通过地址在请求头中携带数据
- 能携带的数据量和地址的长度有关系，一般最多就几K
- GET 可以被缓存
- GET
HTTP 状态码
- 状态码为200，表示请求成功，
- 状态码为301，Moved Permanently表示永久重定向，302Move Temporarily表示临时重定向，304表示使用的是缓存
- 状态码为404，Not Found，表示页面找不到。
- 状态码为500，Internal Server Error，表示服务器端存在未知错误，与浏览器的代码没有任何关系
- 常见的状态码：
- 500~599 服务器错误
- 400~499 请求错误
- 300~399 重定向
- 200~299 成功
- 100~199 消息：代表请求已被接受，需要继续处理
HTTP请求响应过程