封装微信小程序的全局ajax

微信小程序中app.js的变量方法是可以通过getApp()暴露在其他页面的

通过getApp()我们可以封装ajax，这样就不用一个页面一个页面的去写request了

也不用一遍又一遍的去写重复的请求url头部

// app.ts
let _app: any
App<IAppOption>({
  globalData: {
    url: "https://s.whaleng.com/t-go-server",
    shop: "xk",
    shopName: "xx商城",
    shopData: null,
  },
  onLaunch() {
    //设置指向app.ts的this,让app.ts中的函数能获取app中的数据方法1
    _app = this
  },
  /*弹窗提示 主要参数 title*/
  showToast(obj: any = {}): void {
    if (!obj.title) {
      wx.showToast({
        title: 'showToast函数请传入title!',
        icon: "none"
      })
      return
    }
    wx.showToast({
      title: obj.title || '',
      icon: obj.icon || 'none',
      image: obj.image || '',
      duration: obj.duration || 1500,
      mask: obj.mask || false,
      success: obj.success,
      fail: obj.fail,
      complete: obj.complete,
    })
  },
  /*提示后xx秒后跳转 主要参数 提示消息title 跳转类型type 跳转路径url*/
  tipsJump(obj: any = {}): void {
    let app = getApp() || _app;
    if (!app) {
      wx.showToast({
        title: 'tipsJump函数未获取有效this!',
        icon: "none"
      })
      return
    }
    if (!obj.title) {
      app.showToast({
        title: 'tipsJump函数请传入title!',
        icon: "none"
      })
      return
    }
    if (!obj.type) {
      app.showToast({
        title: 'tipsJump函数请传入跳转类型type!',
        icon: "none"
      })
      return
    }
    if (obj.type !== 'navigateBack' && !obj.url) {
      app.showToast({
        title: 'tipsJump函数请传入跳转url!',
        icon: "none"
      })
      return
    }
    app.showToast(obj)
    setTimeout(() => {
      switch (obj.type) {
        case 'switchTab':
          wx.switchTab({
            url: obj.url
          })
          break;
        case 'reLaunch':
          wx.reLaunch({
            url: obj.url
          })
          break;
        case 'redirectTo':
          wx.redirectTo({
            url: obj.url
          })
          break;
        case 'navigateTo':
          wx.navigateTo({
            url: obj.url
          })
          break;
        case 'navigateBack':
          if (obj.delta) {
            wx.navigateBack({
              delta: obj.delta
            })
          } else {
            wx.navigateBack()
          }
          break;
        case 'custom':
          if (obj.custom) {
            obj.custom()
          }
          break;
      }
    }, obj.time || 1500)
  },
  /*显示模态对话框 主要参数 title content 成功调用方法 主要用于确认是否删除 是否跳转页面*/
  showModal(obj: any = {}): void {
    wx.showModal({
      title: obj.title,
      content: obj.content,
      showCancel: obj.showCancel || true,
      cancelText: obj.cancelText || '取消',
      cancelColor: obj.cancelColor || '#000000',
      confirmText: obj.confirmText || '确定',
      confirmColor: obj.confirmColor || '#576B95',
      editable: obj.editable || false,
      placeholderText: obj.placeholderText || '请输入文本',
      success(res) {
        if (obj.success) {
          obj.success(res)
        }
        if (res.confirm) {
          /*用户点击确定时*/
          if (obj.confirm) {
            obj.confirm()
          }
        } else if (res.cancel) {
          /*用户点击取消时*/
          if (obj.cancel) {
            obj.cancel()
          }
        } else if (res.content) {
          /*当editable为true，用户输入文本时*/
          if (obj.editableContent) {
            obj.editableContent()
          }
        }
      },
      fail(err) {
        if (obj.fail) {
          obj.fail(err)
        }
      },
      complete(res) {
        if (obj.complete) {
          obj.complete(res)
        }
      }
    })
  },
  ajax: {
    get(obj: request): void {
      obj.method = 'GET'
      _app.ajax.request(obj)
    },
    post(obj: request): void {
      obj.method = 'POST'
      _app.ajax.request(obj)
    },
    //接口请求
    request(obj: request): any {
      let app = getApp() || _app;
      if (!app) {
        wx.showToast({
          title: 'request函数未获取app!',
          icon: "none"
        })
        return
      }
      //是否有加载效果
      if (obj.loading) {
        wx.showLoading({
          title: obj.loadingText || '加载中',
        })
      }
      //处理请求头
      if (!obj.header) {
        obj.header = {}
      }
      let accessToken = wx.getStorageSync('accessToken')
      Object.assign(obj.header, {
        "access-token": accessToken || '',
        "shop": app.globalData.shop || ''
      })
      //返回promiase
      return new Promise((req, rej) => {
        wx.request({
          url: app.globalData.url + obj.url,
          data: obj.data,
          header: obj.header,
          timeout: obj.timeout,
          method: obj.method,
          dataType: obj.dataType,
          responseType: obj.responseType,
          enableHttp2: obj.enableHttp2,
          enableQuic: obj.enableQuic,
          enableCache: obj.enableCache,
          enableHttpDNS: obj.enableHttpDNS,
          httpDNSServiceId: obj.httpDNSServiceId,
          enableChunked: obj.enableChunked,
          forceCellularNetwork: obj.forceCellularNetwork,
          success: (res: any) => {
            if (res.statusCode == 200) {
              switch (res.data.code) {
                case 200:
                  req(res)
                  break;
                case 400:
                  app.showToast({ title: res.data.msg || '服务器无法识别请求!' })
                  rej(res)
                  break;
                case 401:
                  app.tipsJump({ title: res.data.msg || '未认证，请登录！', type: "reLaunch", url: "/pages/login/index" })
                  rej(res)
                  break;
                case 403:
                  app.showToast({ title: res.data.msg || '暂无权限！' })
                  rej(res)
                  break;
                default:
                  app.showToast({ title: res.data.msg || '服务器繁忙，请稍后重试！' })
                  rej(res)
                  break;
              }
            } else {
              app.showToast({ title: res.data.msg || '服务器繁忙，请稍后重试！' })
              rej(res)
            }
          },
          fail: (err) => {
            app.showToast({ title: err.errMsg || '请求失败，请稍后重试！' })
            rej(err)
          },
          complete: (data) => {
            if (obj.complete) {
              obj.complete(data)
            }
            if (obj.loading) {
              wx.hideLoading()
            }
          }
        })
      })
    },
    //文件上传，调用选择文件图片之类的WXapi后调用
    uploadFile(obj: uploadFile): any {
      let app = getApp() || _app;
      if (!app) {
        wx.showToast({
          title: 'request函数未获取app!',
          icon: "none"
        })
        return
      }
      //是否有加载效果
      if (obj.loading) {
        wx.showLoading({
          title: obj.loadingText || '正在上传文件',
        })
      }
      //处理请求头
      if (!obj.header) {
        obj.header = {}
      }
      let accessToken = wx.getStorageSync('accessToken')
      Object.assign(obj.header, {
        'Content-Type': 'multipart/form-data',
        'access-token': accessToken || '',
        'shop': app.globalData.shop || ''
      })
      //返回promiase
      return new Promise((req, rej) => {
        wx.uploadFile({
          url: app.globalData.url + obj.url,
          filePath: obj.filePath,
          name: obj.name,
          header: obj.header,
          formData: obj.formData,
          timeout: obj.timeout,
          success: (res: any) => {
            if (res.statusCode == 200) {
              req(JSON.parse(res.data))
            } else {
              app.showToast({ title: res.data.msg || '服务器繁忙，请稍后重试！' })
              rej(res)
            }
          },
          fail: (err: any) => {
            app.showToast({ title: err.errMsg || '请求失败，请稍后重试！' })
            rej(err)
          },
          complete: (data) => {
            if (obj.complete) {
              obj.complete(data)
            }
            if (obj.loading) {
              wx.hideLoading()
            }
          },
        })
      })
    },
    //文件下载，下载文件资源到本地,get请求
    downloadFile(obj: downloadFile): any {
      let app = getApp() || _app;
      if (!app) {
        wx.showToast({
          title: 'request函数未获取app!',
          icon: "none"
        })
        return
      }
      //是否有加载效果
      if (obj.loading) {
        wx.showLoading({
          title: obj.loadingText || '正在下载文件',
        })
      }
      //处理请求头
      if (!obj.header) {
        obj.header = {}
      }
      let accessToken = wx.getStorageSync('accessToken')
      Object.assign(obj.header, {
        'access-token': accessToken || '',
        'shop': app.globalData.shop || ''
      })
      return new Promise((req, rej) => {
        wx.downloadFile({
          url: app.globalData.url + obj.url,
          filePath: obj.filePath,
          header: obj.header,
          timeout: obj.timeout,
          success: (res: any) => {
            if (res.statusCode == 200) {
              req(JSON.parse(res.data))
            } else {
              app.showToast({ title: res.data.msg || '服务器繁忙，请稍后重试！' })
              rej(res)
            }
          },
          fail: (err: any) => {
            app.showToast({ title: err.errMsg || '请求失败，请稍后重试！' })
            rej(err)
          },
          complete: (data) => {
            if (obj.complete) {
              obj.complete(data)
            }
            if (obj.loading) {
              wx.hideLoading()
            }
          },
        })
      })
    }
  }
})

在其他页面调用也很简单

    app.ajax.post({url:"/common/getAllAppEnumType"}).then((res:any)=>{
      console.log(res)
    })
    app.ajax.get({url:"/common/getAllAppEnumType"}).then((res:any)=>{
      console.log(res)
    })