promise 请求返回 对象_Proxy一个Promise

为什么会有这么奇怪的需求？说真的在做 _request 前。我也没想过，Proxy 还能用到 Promise 上。但是不得不说，之前我一直觉得自己挺了解 Proxy的，还封装过 _storage 还有 webstorage-proxy 来操作本地存储，直到这次 Proxy Promise 对象时才发现我差的还远呢。

先说需求吧：开发过微信小程序的小伙伴应该对 wx.request 这个 API 不陌生，用起来大概是这样：

wx.request({
    
  url: 'test.php', //仅为示例，并非真实的接口地址
  data: {
    
    x: '',
    y: ''
  },
  header: {
    
    'content-type': 'application/json' // 默认值
  },
  success (res) {
    
    console.log(res.data)
  }
})

不用我说，你就知道。这样操作很容易引起回调地狱。项目简单还好，项目复杂起来，一定很够酸爽的。

不过后来开发项目使用了 uniapp 。uniapp 的 API 对微信小程序的API加了一层封装：如果不传入 success/fail/complete 。request 方法会返回一个 Promise 对象，代价是会丢失原本应该返回的 task 对象，就没法取消请求了。

不过有得就有失，毕竟我们几乎不会遇到取消请求的情况，这样用也勉强能接受。

但是我还想要拦截器、配置 basseURL、自定义超时时间、错误监听等等等。

所以当时我就决定自己封装一个 request 方法，不用太多功能，就用起来跟 axios 一样就行，而且是常规的功能就行。用起来就像这样：

import uni_request from './uni_request.js'

const request = uni_request({
     // 有效配置项只有三个
    baseURL: 'http://192.168.0.13/dwbsapp', //baseURL
    timeout: 1111, // 超时时间
})

请求拦截器用于带 token

request.interceptors.request.use(async (config, ...args) => {
    
    await new Promise(resolve => setTimeout(() => resolve(), 3000))
    console.log('请求拦截器, 网络请求会等 3 秒后上面的异步任务结束后执行') // args[0] method args[1] url args[3] data
    config.header.Authorization = 'Bearer ' + $store.state.app.token // 修改请求头
    config.body.test = 'test' // 修改请求体
    return config
})

其实核心的代码实现起来非常简单， 执行 uni_request ，返回一个对象，这个对象里保存了初始化时的配置信息和配置的拦截器等，同时里面有 get post 等方法用于请求，最简单的代码实现如下：

export default function({
     baseUR