当前位置: 首页>前端>正文

axios包 axios包括ajax吗

目录

1.axios 的使用

1.1 Ajax的概念

1.2 Ajax的五种请求方法

1.3 axios的GET请求

1.4 URL编码

1.5 Ajax的解构赋值

1.6 Ajax的POST请求

1.7 请求报文和响应报文

2.接口文档

2.1 接口的概念

2.2 接口文档的格式

2.3 POSTMAN


1.axios 的使用

本章节讲解: Ajax的概念、Ajax的五种请求方法、axios的GET请求、URL编码、Ajax的解构赋值、Ajax的POST请求、请求报文和响应报文。

1.1 Ajax的概念

Ajax 是浏览器中的技术:用来实现客户端网页请求服务器的数据。它的英文全称是 Asynchronous Javascript And XML,简称 Ajax。

1.2 Ajax的五种请求方法

使用ajax的时候,请求方式的作用是区分本次请求的具体功能,常用请求方式有一下五种:

axios包 axios包括ajax吗,axios包 axios包括ajax吗_ajax,第1张

其中,重点掌握前两种,GET用于获取数据,POST用于推送数据。

1.3 axios的GET请求


axios({
      method: '请求的类型',
      url: '请求的URL地址',
      params: {id: 1, bookname: '红楼梦'} // params用于传递参数,可选
}).then((result) => {
      // .then 用来指定请求成功之后的回调函数
      // 形参中的 result 是请求成功之后的结果
})


注意: GET参数的本质就是把参数用 & 符号链接起来放到路径的最末尾用 ?分隔。

1.4 URL编码

在 URL 地址中不允许出现中文、空格等特殊字符,因此浏览器会自动对 URL 地址内的中文进行转换处理

浏览器内置了 encodeURIComponent() 和 decodeURIComponent() 两个方法,用来实现 URL 的编码和解码处理:

axios包 axios包括ajax吗,axios包 axios包括ajax吗_javascript_02,第2张

1.5 Ajax的解构赋值

axios收到的数据,是经过axios封装之后的所以,res是一个对象,最重要的数据为 data 属性,其他属性很少使用,所以可以通过对象解构的方式把最常用的属性解构出来,其他的暂时可以不用理会:


axios({
  method: 'GET',
  url: 'http://www.liulongbin.top:3009/api/getbooks'
}).then(({ data: res }) => {
  // 从 .then(fn) 回调函数的形参中,解构赋值出 data 属性,重命名为 res
  console.log(res)
})


1.6 Ajax的POST请求

POST请求和GET请求不一样,POST请求一定会伴随着请求参数,因为如果没有参数,我们就不必使用POST请求了,且POST请求的功能就是推送数据:


axios({
  method: 'POST',
  url: 'http://www.liulongbin.top:3009/api/addbook',
  data: { bookname: '三体', author: '刘慈欣', publisher: '北京人民出版社' }
}).then(({ data: res }) => {
  // 从 .then(fn) 回调函数的形参中,解构赋值出 data 属性,重命名为 res
  console.log(res)
})

1.7 请求报文和响应报文

客户端与服务器通信的过程是基于请求与响应的。其中:

  • 请求报文规定了客户端以什么格式把数据发送给服务器
  • 响应报文规定了服务器以什么格式把数据响应给客户端

axios包 axios包括ajax吗,axios包 axios包括ajax吗_状态码_03,第3张

axios包 axios包括ajax吗,axios包 axios包括ajax吗_ios_04,第4张

注意: http 响应状态码 和 业务状态码是不同的;


1. 所处的位置不同:在响应头的状态行中所包含的状态码,叫做“响应状态码”在响应体的数据中所包含的状态码,叫做“业务状态码”。


  1. 表示的结果不同:响应状态码只能表示这次请求的成功与否(成功地失败了)业务状态码用来表示这次业务处理的成功与否
  1. 通用性不同:响应状态码是由 http 协议规定的,具有通用性。每个不同的状态码都有其标准的含义,不能乱用。业务状态码是后端程序员自定义的,不具有通用性。

2.接口文档

本章节讲解: 接口的概念、接口文档的格式、POSTMAN、聊天机器人案例。

2.1 接口的概念

使用 Ajax 请求数据时,被请求的 URL 地址,就叫做数据接口(简称:接口或 API 接口)。

2.2 接口文档的格式

接口文档的格式有很多,txt,word,excel,md等.... 现在最常用的是 html 格式文档。

线上地址,接口文档:ShowDoc

2.3 POSTMAN

接口测试工具能让我们在不写任何代码的情况下,对接口进行调用和测试,从而检查接口能否被正常访问。

后面node.js中具体讲解如何使用。


https://www.xamrdz.com/web/2be1938803.html

相关文章: