Axiso库
官方介绍:
Axios 是一个基于 promise 网络请求库,作用于node.js
和浏览器中。 它是 isomorphic 的(即同一套代码可以运行在浏览器和node.js中)。在服务端它使用原生 node.js http
模块, 而在客户端 (浏览端) 则使用 XMLHttpRequests。
axios官方文档:https://www.axios-http.cn/docs/intro
更新
2024.5.24 第一次更新,主要学习了一下Axiso的基本用法
功能特点
安装
npm install axios
在需要使用的js文件中引入axios
import axios from ‘axios’
axios请求方法
config请求配置
url: url
是用于请求的服务器 URL
method:method
是创建请求时使用的方法
baseURL: baseURL
将自动加在 url
前面,除非 url
是一个绝对 URL。
它可以通过设置一个 baseURL
便于为 axios 实例的方法传递相对 URL
1 2 3
| baseURL: 'https://some-domain.com/api/',
|
transformRequest: transformRequest
允许在向服务器发送前,修改请求数据。
- 它只能用于 ‘PUT’, ‘POST’ 和 ‘PATCH’ 这几个请求方法。
- 数组中最后一个函数必须返回一个字符串, 一个Buffer实例,ArrayBuffer,FormData,或 Stream。
- 你可以修改请求头。
1 2 3 4 5
| transformRequest: [function (data, headers) {
return data; }],
|
transformResponse:transformResponse
在传递给 then/catch 前,允许修改响应数据
1 2 3 4
| transformResponse: [function (data) { return data; }],
|
自定义请求头
1
| headers: {'X-Requested-With': 'XMLHttpRequest'},
|
params:params
是与请求一起发送的 URL 参数,必须是一个简单对象或 URLSearchParams 对象
paramsSerializer:paramsSerializer
是可选方法,主要用于序列化params
1 2 3
| paramsSerializer: function (params) { return Qs.stringify(params, {arrayFormat: 'brackets'}) },
|
data:data
是作为请求体被发送的数据
- 仅适用 ‘PUT’, ‘POST’, ‘DELETE 和 ‘PATCH’ 请求方法
- 在没有设置
transformRequest
时,则必须是以下类型之一:
- string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams
- 浏览器专属: FormData, File, Blob
- Node 专属: Stream, Buffer
1 2 3
| data: { firstName: 'Fred' },
|
- timeout:
timeout
指定请求超时的毫秒数。
withCredentials:withCredentials
表示跨域请求时是否需要使用凭证
adapter:adapter
允许自定义处理请求,这使测试更加容易。
1 2 3 4
| adapter: function (config) { },
|
responseEncoding:responseEncoding
表示用于解码响应的编码 (Node.js 专属)
注意:忽略 responseType
的值为 ‘stream’,或者是客户端请求
1
| responseEncoding: 'utf8',
|
更多参数,查询:https://www.axios-http.cn/docs/req_config
axios
axios(config)
axios(config)——post请求
1 2 3 4 5 6 7 8 9
| axios({ method: 'post', url: '/user/12345', data: { firstName: 'Fred', lastName: 'Flintstone' } });
|
axios(config)——get请求
1 2 3 4 5 6 7 8 9
| axios({ method: 'get', url: 'http://bit.ly/2mTM3nY', responseType: 'stream' }) .then(function (response) { response.data.pipe(fs.createWriteStream('ada_lovelace.jpg')) });
|
axios(url[, config])
请求别名
axios.request(config)
axios.get(url[, config])
axios.delete(url[, config])
axios.head(url[, config])
axios.options(url[, config])
axios.post(url[, data[, config]])
axios.put(url[, data[, config]])
axios.patch(url[, data[, config]])
axios.postForm(url[, data[, config]])
常用的两个
axios.get
axios.post
Url:请求地址
data:请求体
config:配置