VUE自定义插件来实现发起HTTP请求的功能_vue1.x使用http请求工具

Vue中，可以通过自定义插件来实现发起HTTP请求的功能。

通常可以自定义一下几个功能：

封装HTTP请求：封装HTTP请求的细节，例如请求方法、请求头、请求数据等，使得调用方不需要关注这些细节，只需要提供请求URL和请求数据即可。

返回Promise对象：返回一个Promise对象，用于处理请求的结果，例如成功或失败的回调函数。

统一处理错误：处理请求过程中可能发生的错误，例如网络错误或服务器错误，统一处理这些错误，以便于调用方可以更方便地处理错误。

可配置性：提供一些可配置的选项，例如请求超时时间、请求重试次数等，以便于调用方可以根据自己的需求来配置这些选项。

首先需要先定义一个插件来使用该方法，示例代码如下：

import axios from 'axios';
 
const callService = {
  // 默认配置
  defaults: {
    baseURL: 'https://example.com/api',
    timeout: 10000,
    retry: 3,
    retryDelay: 1000
  },
 
  // 封装HTTP请求
  request(url, method, data = {}, options = {}) {
    const config = {
      url,
      method,
      data,
      ...this.defaults,
      ...options
    };
 
    return axios(config).then(res => {
      // 处理HTTP请求成功的情况
      return Promise.resolve(res.data);
    }).catch(error => {
      // 处理HTTP请求失败的情况
      const { response } = error;
      if (response) {
        // HTTP响应错误
        const { status, data } = response;
        return Promise.reject({ status, data });
      } else {
        // 网络错误
        return Promise.reject({ status: -1, data: 'Network Error' });
      }
    });
  },
 
  // 封装GET请求
  get(url, params = {}, options = {}) {
    return this.request(url, 'get', { params }, options);
  },
 
  // 封装POST请求
  post(url, data = {}, options = {}) {
    return this.request(url, 'post', data, options);
  },
 
  // 封装PUT请求
  put(url, data = {}, options = {}) {
    return this.request(url, 'put', data, options);
  },
 
  // 封装DELETE请求
  delete(url, options = {}) {
    return this.request(url, 'delete', {}, options);
  }
};
 
export default callService;

上面的代码定义了一个callService的对象，其中包含了常见的HTTP请求方法（get、post、put、delete）同时提供了一些默认配置（baseURL、timeout、retry、retryDelay），这些方法都返回一个Promise对象，用于处理请求的结果。

现在使用它发起请求，示例代码如下：

import callService from './callService';
 
// 发起一个GET请求
callService.get('/users', {name: 'John'}).then(data => console.log(data));
 
// 发起一个POST请求
callService.post('/users', {name: 'John', age: 30}).then(data => console.log(data));

调用callService对象的get和post方法来发起HTTP请求，第一个参数是URL，第二个参数是请求的数据包。然后返回的Promise对象可以使用then()方法来处理请求的结果。