Axios

1.Axios 是一个基于 Promise 的现代化 HTTP 客户端库,适用于浏览器和 Node.js 环境。

2.在axios里有几种基础请求方法,在网课学习里面我们使用基础请求方法与现在用的不大相同,在网课中我们一般用以下格式

复制代码
​
axios({
        url: 'http://hmajax.itheima.net/api/login',
        method: 'POST',//选择请求方式
        data: {
          username,
          password
        }
      }).then(result => {
        alertFn(result.data.message, true)
      }).catch(error => {
        console.log(error);

        alertFn(error.response.data.message, false)
      })

​

2.1GET 请求

这种书写方式使代码更加简便,而且目的更加明了,以后在写代码的时候我也会使用这种方法。而他书写参数的方法和之前的一样,方式一:URL 中直接拼接参数,方式二:通过 params 对象传递(推荐)。

复制代码
axios.get('https://api.example.com/users')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

2.2 POST 请求

复制代码
axios.post('/user', {
  firstName: '张',
  lastName: '三',
  age: 30
})
.then(response => {
  console.log(response.data);
});

2.3 其他请求方法

复制代码
// PUT 请求
axios.put('/user/123', {
  name: '李四'
});

// DELETE 请求
axios.delete('/user/123');

// PATCH 请求
axios.patch('/user/123', {
  name: '王五'
});

// HEAD 请求
axios.head('/user');

3.请求拦截器

请求拦截器是 Axios 中一个强大的功能,允许你在请求发送到服务器之前对请求进行拦截和处理。

请求拦截器是在请求被发送之前执行的函数,可以用于:修改请求配置,添加认证信息,设置全局请求头,记录请求日志,验证请求参数

这段代码可以添加请求拦截器

复制代码
axios.interceptors.request.use(
  config => {
    // 在发送请求前做些什么
    return config;
  },
  error => {
    // 对请求错误做些什么
    return Promise.reject(error);
  }
);
相关推荐
小小愿望5 分钟前
移动端浏览器中设置 100vh 却出现滚动条?
前端·javascript·css
fail_to_code5 分钟前
请不要再只会回答宏任务和微任务了
前端
摸着石头过河的石头6 分钟前
taro3.x-4.x路由拦截如何破?
前端·taro
lpfasd12314 分钟前
开发Chrome/Edge插件基本流程
前端·chrome·edge
DavieLau30 分钟前
C#项目WCF接口暴露调用及SOAP接口请求测试(Python版)
xml·服务器·开发语言·python·c#
张人玉34 分钟前
C#Encoding
开发语言·c#
练习前端两年半1 小时前
🚀 Vue3 源码深度解析:Diff算法的五步优化策略与最长递增子序列的巧妙应用
前端·vue.js
烛阴1 小时前
TypeScript 接口入门:定义代码的契约与形态
前端·javascript·typescript
Hard but lovely1 小时前
C++:stl-> list的模拟实现
开发语言·c++·stl·list
掘金安东尼1 小时前
使用自定义高亮API增强用户‘/’体验
前端·javascript·github