【前后端交互】Ajax

1.客户端与服务器

• 服务器：一台电脑，上网时负责存放和对外提供资源的电脑
• 客户端：一台电脑，上网时负责获取和消费资源的电脑

2.URL地址

2.1 概念

• 英文全称：uniform resource locator
• 中文：统一资源定位符
• 作用：用于表示互联网上每个资源的存放尾椎
• 过程：浏览器只有通过URL地址，才能正确定位资源的存放位置，从而正确访问对应资源
• 例如：https://www.baidu.com/

2.2 组成部分

• 客户端与服务器之间的通信协议
• 存有该资源的服务器名称
• 资源在服务器上具体的存放位置
  

3. 客户端与服务器的通信过程

注意

1. 客户端与服务器之间的通信过程，分为请求-处理-响应三个步骤。
2. 网页中的每一个资源， 都是通过请求-处理-响应的方式从服务器获取回来的。

4. 网页中如何请求数据

- 需要用到XMLHttpRequest对象，请求服务器上的数据资源

• 使用：var xhrObj = new XMLHttpRequest()

资源请求方式

• get和post
• get 请求通常用于获取服务端资源(向服务器要资源)
  例如：根据URL地址,从服务器获取HTML文件、Css 文件、js文件、图片文件、数据资源等
• post 请求通常用于向服务器提交数据(往服务器发送资源)
  例如：登录时向服务器提交的登录信息、注册时向服务器提交的注册信息、添加用户时向服务器提交的用户信息等各种数据提交操作

Ajax的典型应用场景

• 用户名检测：注册用户时，通过Ajax的形式，动态检测用户名是否被占用
• 搜索提示：当输入搜索关键字时，通过ajax的形式，动态加载搜索提示列表
• 数据分页显示：当点击页码值的时候，通过ajax的形式，根据页码值动态刷新表格的数据
• 数据的增删改查：数据的添加、删除、修改、查询操作,都需要通过ajax的形式，来实现数据的交互