1. 客户端与服务器
服务器：上网过程中，负责存放和对外提供资源的电脑。（性能很高的电脑。）
客户端： 在因特网中，负责获取和消费资源的电脑。
个人电脑中，可以通过浏览器访问服务器对外提供的各种资源。
2. URL地址
URL（UniformResourceLocator）：统一资源定位符。
用于标识互联网上每个资源的唯一存放位置。浏览器只有通过URL地址，才能正确定位资源的存放位置，从而成功访问正确的资源。
URL：www.google.com ; www.baidu.com
URL的组成（三部分）：
-
客户端与服务器之间的 通信协议 ：http
-
存有该资源的 服务器名称 : www.google.com
-
资源在服务器上 具体的存放位置 : /video/BV1zs411h74a?p=2&vd_source=86336122c63c1128fa57fab9ace00bbd
3. 分析网页的打开过程(请求，处理，响应)
过程：
-
客户端请求服务器
-
服务器处理请求
-
服务器响应客户端
打开browser，输入要访问的网站地址，向服务器发起资源请求
a. 服务器接收到客户端发来的资源请；b. 服务器内部处理请求，找到相关资源；c. 服务器把找到的资源，响应（发送）给客户端
基于开发者工具分析通信过程
-
console，network
-
Doc页签（代表网页）
-
刷新页面，分析客户端与服务器通信过程
4. 服务器对外提供哪些资源
常见资源
文字，图片，audio，video
数据也是一种资源
网页中的数据，也是服务器对外提供的一种资源
html，css，js皆是为数据服务
网页中如何请求数据
只要是资源，必然要通过 请求，处理，响应 的方式进行获取
如果在网页中请求服务器上的数据资源，需要用到XMLHttpRequest对象
XMLHttpRequest（xhr）
browser提供的js成员，可以通过它服务器上的数据资源
最简单的用法var xhrObj = new XMLHttpRequest()
资源的请求方式
最常见的两种：get 和 post
get请求：
通常用于 获取服务器资源（向服务器要资源）：根据URl地址，向服务器获取HTML，css，js，图片文件，数据资源等。
post请求：
通常用于 向服务器提交数据 （往服务器发送数据）：向服务器提交登录信息，注册信息，添加用户提交用户信息等数据提交操作。
5. Ajax
概念：
Asynchronous Javascript And XML（异步javascript和XML）
实现网页和服务器间的数据交互
典型应用场景
用户名检测：通过ajax，动态 检测 用户名是否被占用
搜索提示：输入关键字时，动态加载搜索提示列表
数据分页显示： 点击页码值时，根据页码值动态刷新表格的数据
数据的增删改查：购物车删除商品之类的
Ajax实现步骤
-
var xhrObj = new XMLHttpRequest()，使用XMLHttpRequest构造函数实例化创建一个xhr -
告诉 Ajax 请求方式和请求地址，以何种方式发送请求，向哪发送请求
xhr.open('get', 'http://www.example.com') -
发送请求
xhr.send(); -
获取服务器端给与客户端的响应数据
响应受到网络环境的影响，发送请求以后不能直接去接收数据（例如网络拥挤导致服务器延迟响应），而是要使用
onload方法监听服务器的响应状态。responseText是服务器响应的数据内容。xhr.onload = function () {
console.log(xhr.responseText);
}
6. jquery中的ajax（未）
https://www.bilibili.com/video/BV1zs411h74a/?vd_source=86336122c63c1128fa57fab9ace00bbd
P5，6，7
7. 接口
概念：
使用Ajax请求数据时，被请求的URL地址，就叫做数据接口（简称 接口），同时，每个接口必须要有请求方式。
http://www.liulongbin.top:3006/api/getbooks 获取图书列表的接口（get请求）
http://www.liulongbin.top:3006/api/addbook 添加图书的接口（post请求）
https://ajax-base-api-t.itheima.net/
接口的请求过程
通过get方式请求接口的过程
网页中的对象，xhr封装，jq相关的ajax函数，通过ajax向服务器发送get数据请求，服务器处理请求，再响应get请求。
通过post方式请求接口的过程
ajax向服务器发起post数据请求，服务器处理请求，再响应post请求。
接口测试工具
作用
在不写任何代码的情况下，对接口进行 调用 和 测试
常用：PostMan，ApiPost
步骤
-
选择请求方式
-
填写请求的URL地址
-
填写请求的参数
-
get请求是query面板；post请求是post面板并勾选数据格式（x-www-form-urlencoded）
-
发起请求
-
查看服务器响应的结果
8. 接口文档
概念：
接口的说明文档，调用接口的依据；参考接口文档知道接口的作用，以及接口如何调用。
好的接口文档包含：
-
接口名称：用来标识各个接口的简单说明，如登陆接口，获取图书列表接口
-
接口URL：接口的调用地址
-
调用方式：如get，post
-
参数格式：接口需要传递的参数，每个参数必须包含 参数名称，参数类型，是否必选，参数说明 这4项内容
-
响应格式：接口的返回值的详细描述，一般包含 数据名称，数据类型，说明 三项内容
-
返回示例（可选）：通过对象的形式，举例服务器返回数据的结构
9. 渲染html
-
获取ajax请求获取数据
-
获取列表数据是否成功
-
渲染页面结构