axios请求五种方法(笔记)

axios请求五种方法

一、介绍

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({
     
                   methods: 'get',
                   url: 'url',
                   params: {
     
                        id:12
                   }
               })1

带参数

方式一: 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
	 })<br>    其中 data可以有两种格式form-data(图片上传,文件上传)  applicition/json(目前比较流行)<br>      上面两种方法 都是 appliction/json格式<br>    如下为: form-data<br>    let formData = new FormData()<br>       let data = {
     <br>      id: 12<br>    }<br>       for (let key in data) {
     <br>        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就行  ***转载:https://www.cnblogs.com/webtaotao/p/11465663.html***

你可能感兴趣的:(工具的使用,vue.js)