axios封装和使用

axios是一个基于Promise的HTTP客户端，用于浏览器和Node.js。它可以用于发送异步请求并处理响应。下面是axios的封装和使用方法：

1. 安装axios：在终端中输入npm install axios命令进行安装。

2. 引入axios：在需要使用axios的文件中，使用import语句引入axios。

3. 封装axios：可以将axios进行封装，以便在多个地方使用。例如：

import axios from 'axios';

const instance = axios.create({
  baseURL: 'https://api.example.com',
  timeout: 1000,
  headers: {'X-Custom-Header': 'foobar'}
});

export default instance;

4. 使用axios：使用axios发送请求，例如：

import axios from './axios';

axios.get('/user?ID=12345')
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

相关问题

axios封装使用案例

引用: 在实际工作项目中，使用axios进行请求时，可能需要访问多个服务地址，而这些服务请求和响应的结构也可能都完全不同。为了更好地处理这种情况，我们可以通过axios.create()方法创建不同的实例来进行处理。创建实例的好处是可以单独为不同的实例配置拦截器、超时时间、请求头等。比如，可以为axios1配置某种拦截器，而为axios2配置另一种拦截器，以满足不同的需求。

引用: 创建axios实例时，可以传入一个配置对象来对实例进行配置，如果不传入配置对象，则默认使用全局的配置。如果创建了实例，但又想修改实例的某些配置，可以直接通过实例对象进行修改。需要注意的是，axios请求配置的优先级是axios请求配置 > axios实例配置 > axios全局配置。

针对axios实例的使用，可以使用实例的get、post、post_json等方法来发送请求。这些方法的使用方式与全局的axios.get、axios.post等方法类似，只是需要通过实例对象来调用。具体使用案例可以参考以下代码：

// 创建axios实例
const instance = axios.create({
  baseURL: 'http://api.example.com', // 设置请求的基础URL
  timeout: 5000, // 设置超时时间为5秒
 headers: {
    'Content-Type': 'application/json' // 设置请求头的Content-Type为JSON
  }
});

// 发送GET请求
instance.get('/users')
  .then(res => {
    console.log(res.data);
  })
  .catch(error => {
    console.error(error);
  });

// 发送POST请求
instance.post('/users', {
  name: 'John',
  age: 25
})
  .then(res => {
    console.log(res.data);
  })
  .catch(error => {
    console.error(error);
  });

以上示例展示了如何创建axios实例，并使用实例的get和post方法发送请求。你可以根据自己的需求配置实例，

axios 封装jsonp 并使用

好的，下面是 axios 封装 jsonp 并使用的代码示例：

import axios from 'axios'
import jsonp from 'jsonp'

function jsonpRequest(url, params) {
  return new Promise((resolve, reject) => {
    jsonp(url, {
      param: 'callback',
      timeout: 5000,
      ...params
    }, (err, data) => {
      if (err) {
        reject(err)
      } else {
        resolve(data)
      }
    })
  })
}

function axiosJsonp(url, params) {
  return axios({
    url,
    method: 'get',
    params,
    transformResponse: [function (data) {
      return data
    }],
    adapter: jsonpRequest
  })
}

// 使用示例
axiosJsonp('https://example.com/api', { id: 1 }).then(res => {
  console.log(res)
}).catch(err => {
  console.error(err)
})

这里我们使用了 `jsonp` 库来实现 jsonp 请求，并将其作为 `axios` 的适配器使用。在 `axiosJsonp` 函数中，我们将 `adapter` 属性设置为 `jsonpRequest` 函数，这样 `axios` 就会使用 `jsonpRequest` 函数来发送请求。