axios 是一个基于 Promise 的 HTTP 客户端,用于浏览器和 node.js。它有许多优秀的特性,以下是其中七个主要特性及其详细代码示例:
axios 的所有请求都返回一个 Promise 对象,这使得异步操作变得非常直观和易于管理。
- axios.get('https://api.example.com/data')
- .then(response => {
- console.log(response.data);
- })
- .catch(error => {
- console.error(error);
- });
拦截器允许你在请求发送到服务器或响应返回到客户端之前对它们进行修改。
- // 请求拦截器
- axios.interceptors.request.use(
- config => {
- // 在发送请求之前做些什么
- return config;
- },
- error => {
- // 对请求错误做些什么
- return Promise.reject(error);
- }
- );
-
- // 响应拦截器
- axios.interceptors.response.use(
- response => {
- // 对响应数据做点什么
- return response;
- },
- error => {
- // 对响应错误做点什么
- return Promise.reject(error);
- }
- );
你可以为请求和响应数据指定转换器。
- axios.defaults.transformRequest = [function (data) {
- // 对请求数据进行转换
- return JSON.stringify(data);
- }];
-
- axios.defaults.transformResponse = [function (data) {
- // 对响应数据进行转换
- return data;
- }];
使用 CancelToken 可以取消一个正在进行的请求。
- const CancelToken = axios.CancelToken;
- let source = CancelToken.source();
-
- axios.get('/user/12345', {
- cancelToken: source.token
- }).catch(function (thrown) {
- if (axios.isCancel(thrown)) {
- console.log('Request canceled', thrown.message);
- } else {
- // 处理错误
- }
- });
-
- // 取消请求 (请求原因是可选的)
- source.cancel('Operation canceled by the user.');
axios 会自动将 JSON 数据转换为 JavaScript 对象。
- axios.get('https://api.example.com/data')
- .then(response => {
- // axios 会自动将 JSON 数据转换为 JavaScript 对象
- const data = response.data;
- console.log(data);
- });
axios 库支持库级别的 XSRF(跨站请求伪造)保护。
- // 当使用 withCredentials 时,axios 会自动设置 XSRF-TOKEN cookie
- axios.defaults.xsrfCookieName = 'XSRF-TOKEN'; // 默认值是:XSRF-TOKEN
- axios.defaults.xsrfHeaderName = 'X-XSRF-TOKEN'; // 默认值是:X-XSRF-TOKEN
你可以通过配置对象的 auth 属性来自动设置 HTTP 授权头。
- axios({
- method: 'get',
- url: 'https://api.example.com/private',
- auth: {
- username: 'myusername',
- password: 'mypassword'
- }
- });
在上述示例中,axios 会自动在请求头中添加 Authorization 字段,值为 Basic base64(username:password)。
请注意,axios 的特性和用法远不止这些,这些只是其中的一部分。要了解更多关于 axios 的信息,建议查阅其官方文档。