axios的请求方式

YaNglIN123i

已于 2022-05-24 16:17:02 修改

阅读量149

点赞数

文章标签：前端 http javascript

于 2022-05-24 15:58:43 首次发布

本文链接：https://blog.csdn.net/YaNglIN123i/article/details/124948513

版权

本文详细介绍了axios库在JavaScript中进行GET和POST请求的用法，包括设置URL参数、请求头信息以及通用配置。示例代码展示了如何发送带有数据和参数的请求，并解析响应的各个部分，如状态码、状态文本、头信息和响应数据。

摘要由CSDN通过智能技术生成

get请求

axios.get('http://127.0.0.1:8000/axios' , {
        //url 参数
        params:{
          id:1
        },
        //请求头信息
        headers:{
          name:'XX',
          age:20
        }
      })

post请求

 axios.post('http://127.0.0.1:8000/axios' , 
      {
        //请求体
        data:{
          username:'admin',
          password:'admin'
        }
      },
      {
        //url 参数
        params:{
          id:1
        },
        //请求头信息
        headers:{
          name:'XX',
          age:20
        }
      })

通用方式

 //配置 baseURL
      axios.defaults.baseURL= 'http://127.0.0.1:800'
      axios({
        //url
        url:'/axios',
        //url参数
        params:{
          vip:10,
          level:30
        },
        //头信息
        headers:{
          a:100,
          b:200
        },
        //请求体参数
        data:{
          username:'admin',
          password:'admin'  
        }
      }).then(response=>{
        console.log(response);
        //响应状态码
        console.log(response.status);
        //响应状态字符串
        console.log(response.statusText);
        //响应头信息
        console.log(response.headers);
        //响应体
        console.log(response.data);
      })