首页 > 编程知识 正文

axios请求原理,axios请求怎么写

时间:2023-05-06 03:41:13 阅读:201192 作者:3612

一、介绍

Axios是一个基于promise的HTTP库,可以用在浏览器和node.js中

可以提供以下服务:

1、从浏览器中创建XMLHttpRequests

2、从node.js创建http请求

3、支持PromiseAPI

4、拦截请求和响应

5、转换请求数据和响应数据

6、取消请求

7、自动转换JSON数据

8、客户端支持防御XSRF

二、使用

1、axios的安装: 

  安装命令; npm install axios

2、axios五种请求:

  1.get: 一般多用于获取数据  

不带参数   方式一: axios({ methods: 'get', url: '/ulr' })方式二: axios.get('/url')带参数 方式一: axios.get('/url', {params: {id: 12}}) //请求的地址实际为 localhost:8080/url?id=12 方式二: axios({ methods: 'get', url: 'url', params: { id:12 } })

2.post: 主要提交表单数据和上传文件

let data = {} let config = {} 方式一: axios.post('/url',data,config) 方式二: axios({ methods: 'post', url: '/url', data: data, config: config })    其中 data可以有两种格式form-data(图片上传,文件上传) applicition/json(目前比较流行) 上面两种方法 都是 appliction/json格式    如下为: form-data    let formData = new FormData() let data = {      id: 12    } for (let key in data) {     formData.append(key, data[key]) //创建form-data格式数据 }     axios({      methods: 'post',     url: '/url',      data: formData     }) 该请求发出之后可以在浏览器中查看此次请求的request header里面content-type: 为 form-data形式

3.put对数据全部进行更新

    该请求和post类似,只是请求方法不同

4.patch只对更改过的数据进行更新

     该请求和post类似,只是请求方法不同

5.delete删除请求(参数可以放在url上也可以和post一样放在请求体中)

   axios.delete('/url', {params: {id: 12}})  参数在url params很重要

           axios.delete('/url', {data: {id: 12}}) 参数在请求体中 将params改为 data就行 

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。