您的位置：首页 > 移动开发 > IOS开发

Axios

2020-07-19 04:09 801 查看

**

Axios

**
- 基本用法：
// 注意：这里的res形参是约定俗成的，是response的意思，里面是与本次请求相关的响应信息，并不是最终的响应数据
axios.get(‘http://localhost:3000/someapi’).then((res) => {
console.log(res.data) // 通过res.data获取最终的响应数据
})

常用API：

  • get：获取
  • delete：删除
  • post：添加
  • put：修改
  • 传参： get|delete： 语法：axios.get|delete(url, config)
  • get和delete语法都一样，仅方法名不一样
  • x-www-form-urlencoded：/someapi?name=zs&age=18
  • RestFul：/someapi/zs/18
  • params选项：axios.get|delete(url, { params: { name: ‘zs’, age: 18 } }) 这种方式和x-www-form-urlencoded是一样的，二者推荐使用这个
  • 补充说明：其实x-www-form-urlencoded和RestFul可以混合使用，比如：/someapi/zs?age=18
  • post|put：
      语法：axios.post|put(url, data, config)
    • post和put语法都一样，仅方法名不一样
    • 请求地址都支持x-www-form-urlencoded和RestFul的形式
    • 传递参数时，和get与delete有区别，第二个参数直接就是请求数据，如：axios.post|put(url, { name: ‘zs’, age: 18 }, config)，而get与delete的第二个参数是配置对象，配置对象里面的params选项才是真正的x-www-form-urlencoded形式的请求数据，而post和put的第三个参数才是配置对象
    • JSON：axios.post|put(url, { name: ‘zs’, age: 18 })
    • x-www-form-urlencoded：
      const data = new URLSearchParams()
      data.append(‘name’, ‘zs’)
      data.append(‘age’, 18)
      axios.post|put(url, data)
  • 响应结果（axios将真正的响应数据包装在响应结果对象中了）：
      data：实际的响应数据
    • status：HTTP状态码
    • config：axios相关配置对象
    • headers：响应头信息
    • statusText：响应文本信息

    全局配置：

    • timeout：不是延迟发送ajax请求的时间，而是响应超时时间，单位（毫秒），也就是说，如果请求发出去后，在指定的时间内还没有响应，那么就GG了
    • baseURL：基准请求地址，可以统一管理基准请求地址，快速切换请求服务器，在变更后台接口环境的时候，很方便，配置了基准请求地址，在每次调用axios API 发送ajax请求时，就无须携带请求地址前缀了。
    • headers：请求头信息，通常用来发送token令牌

    拦截器（可以在这里处理一些公共的业务）

    • 请求拦截器： 语法：axios.interceptors.request.use((config) => { return config }, (err) => {})
    • 配置了请求拦截器后，在每个请求发出去之前都会先进入请求拦截器
    • 可以在请求拦截器的成功函数中获取的当前的配置对象config，在这里可以基于现有的config做一些修改，返回值会作为最终的请求配置
  • 响应拦截器：
      语法：axios.interceptors.response.use((res) => { return res }, (err) => {})
    • 配置了响应拦截器后，在每个请求响应之前都会先进入响应拦截器
    • 可以在响应拦截器的成功函数中获取当前的响应结果，可以在这里，基于现有响应结果做调整或格式化，返回值会作为最终的响应结果（不建议在响应拦截器中把部分响应信息吃掉，比如只返回res.data，如果需要获取到除了响应数据之外的其他结果，就不友好了）
    • 内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
    标签： 
    相关文章推荐
    新的分享
    章节导航