小程序接口的promise化的实现方法

最近在写微信小程序，为了能用上 async/await 方法，需要把微信提供的异步操作包装成 Promise 对象，为此写了一个简单的 promise(fie) 函数：

/**
 * @function promise - 将 wx 接口 promise 化
 *
 * @param { String|Function } wxApi - 需要转换的接口/接口名
 * @param { Object|Any } [originParam = {}] - 原接口要求的参数对象
 * @param { Object|Any } [extra] - 接口要求的其他参数
 */
function promise(wxApi, originParam = {}, extra){
 const api = wxApi instanceof Function?
  wxApi:
  wx[wxApi];

 return new Promise((done, fail) =>
  api(Object.assign(
   originParam,
   {
    success: done,
    failed: fail
   }
  ),
  extra)
 );
}

正当我沾沾自喜、兴致冲冲地调用拍照接口测试时，控制台扔给我一个 “this._invokeMethod is not a Function” 的错误。显而易见，由于 wxApi 被当做参数传递，执行时的 this 与预期不一致，因此需要显式指定上下文，遂把函数再改改：

/**
 * @function promise - 将 wx 接口 promise 化
 *
 * @param { String|Function } wxApi - 需要转换的接口/接口名
 * @param { Object|Any } [originParam = {}] - 原接口要求的参数对象
 * @param { Object|Any } [context = wx] - 执行上下文
 * @param { Object|Any } [extra] - 接口要求的其他参数
 */
function promise(wxApi, originParam = {}, context = wx, extra){
 const api = wxApi instanceof Function?
  wxApi:
  context[wxApi];

 return new Promise((done, fail) =>
  api.call(context, Object.assign(
   originParam,
   {
    success: done,
    failed: fail
   }
  ),
  extra)
 );
}

由于大部分接口都是 wx 的方法，因此这个 promise 方法在大多数情况下还是比较省事的。不过拍照接口是 cameraContext 的方法，所以传递的是 createCameraContext 方法的返回值：

/**
 * @function takePhoto - promise风格的拍照接口
 *
 * @param { Object|Any } [options = {}] - 相机配置
 *
 * @return {Promise}
 */
export function takePhoto(options = {}){
  const tempOptions = {
    quality: 'high',
    ...options
  }

 const cameraContext = createCameraContext();

 return promise(cameraContext.takePhoto, tempOptions, cameraContext);
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 详解将微信小程序接口Promise化并使用async函数

    前言 小程序一直到现在接口还是和刚开始一样使用的回调函数的方式,如果想在小程序中不使用框架的情况下使用Promise+Async怎么办呢? 2019最新解决方案 1. 将接口Promise化 首先建一个文件wxPromise.js const promisify = name => option => { return new Promise((resolve, reject) => wx[name]({ ...option, success: resolve, fail: reject

  • 小程序接口的promise化的实现方法

    最近在写微信小程序,为了能用上 async/await 方法,需要把微信提供的异步操作包装成 Promise 对象,为此写了一个简单的 promise(fie) 函数: /** * @function promise - 将 wx 接口 promise 化 * * @param { String|Function } wxApi - 需要转换的接口/接口名 * @param { Object|Any } [originParam = {}] - 原接口要求的参数对象 * @param { Obj

  • 小程序api实现promise封装过程解析

    这篇文章主要介绍了小程序api实现promise封装过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 微信小程序和支付宝小程序的api封装方法是一样的,都是外部新建一个js,使用module.exports导出,要注意的是,最好使用post请求,虽然get请求没什么不好,主要是好修改.这里使用的MD5进行了token加密,最好还是把md5.js单独写下来(MD5函数js) 代码如下 var app = getApp(); // 引入app

  • 全网小程序接口请求封装实例代码

    前言 这篇文章主要针对一些初学者,有写的不好的地方,还请大家多多谅解! 在utils文件夹里面新建两个js文件,一个是api.js.一个就是requtil.js api.js 这个文件主要api接口,废话不多说直接上代码了 const request = require('requtil.js') /*Apis 把全部api都存在这里*/ const Apis = { /* 用户相关 */ 'login': '/devicecenter/auth/weChtLoin', 'bindUser':

  • 微信小程序中使用Promise进行异步流程处理的实例详解

    微信小程序中使用Promise进行异步流程处理的实例详解 我们知道,JavaScript是单进程执行的,同步操作会对程序的执行进行阻塞处理.比如在浏览器页面程序中,如果一段同步的代码需要执行很长时间(比如一个很大的循环操作),则页面会产生卡死的现象. 所以,在JavaScript中,提供了一些异步特性,为程序提供了性能和体验上的益处,比如可以将代码放到setTimeout()中执行:或者在网页中,我们使用Ajax的方式向服务器端做异步数据请求.这些异步的代码不会阻塞当前的界面主进程,界面还是可以

  • 微信小程序利用co处理异步流程的方法教程

    微信小程序利用co处理异步流程的方法教程

    本文主要介绍的是关于微信小程序利用co处理异步流程的方法教程,分享出来供大家参考学习,需要的朋友们下面来看看详细的介绍: co co是一个基于ES6 Generator特性实现的[异步流程同步化]写法的工具库. co需要使用Promise特性,所以,我们先来创建一个使用Promise来处理的异步方法: function myAsyncFunc() { return new Promise(function (resolve, reject) { setTimeout(function () {

  • 微信小程序获取用户信息的两种方法wx.getUserInfo与open-data实例分析

    微信小程序获取用户信息的两种方法wx.getUserInfo与open-data实例分析

    本文实例讲述了微信小程序获取用户信息的两种方法wx.getUserInfo与open-data.分享给大家供大家参考,具体如下: 在此之前,小程序获取微信的头像,昵称之类的用户信息,我用的都是wx.getUserInfo,例如: onLoad: function (options) { var that = this; //获取用户信息 wx.getUserInfo({ success: function (res) { console.log(res); that.data.userInfo

  • 微信小程序如何再次获取用户授权的方法

    现在在做一个小程序有地图的功能,通过点击按钮打开地图.调用wx.getlocation()这个接口是需要用户的授权.如果他授权了,返回一个success当然最好啦,就什么问题都没有了.如果他点了取消,返回一个fail,我就使用预设的经纬度打开一个定位.但是如果用户点击返回以后,再次点击按钮进入地图就会没有反应(如果一开始有授权的话就可以再次重新打开地图). 有什么方法可以解决呢,或者怎样可以重新获取用户授权.毕竟叫他们删了重来的话,这样的体验好像不大好... 方法:A:单击隐藏图章wx.open

  • 微信小程序如何刷新当前界面的实现方法

    在微信小程序开发的过程中,在一个页面中对数据操作之后我们大多数时间都需要刷新一下当前界面以把操作之后的结果显示出来,但是如何在执行操作后进行本页面的刷新就成了一个问题很大但是很需要的操作.下面介绍一下微信小程序刷新当前界面的几种方法. 方法一:this.onLoad() 使用方法:在操作函数中调用this.onLoad()或that.onLoad()(有时候this的作用域不够的时候需要定义that = this). 适用场景:本次操作对页面onLoad函数所携带的各种参数没有影响.这时候我们在

  • 微信小程序数据统计和错误统计的实现方法

    微信小程序数据统计和错误统计的实现方法

    某些情况下我们需要对小程序某些用户的行为进行数据进行统计,比如统计某个页面的UV, PV等,统计某个功能的使用情况等.好让产品对于产品的整个功能有所了解. 在网页里,我们很多人都用过谷歌统计,小程序里也有一些第三方数据统计的库, 比如腾讯的MTA等等. 但是,第三方的数据统计库要么功能太简单,满足不了需求,要么就是要收费.(留下了贫穷的泪水.) 等等,又不是你出钱,怕啥? 贵一点就贵一点呀. 嗯,说的没错.但是,公司团队内部想实现一套完整的自己的数据统计系统以满足自己的需求.所以,还是没有用第三

  • 在小程序中推送模板消息的实现方法

    前段时间剁手了 PS4,在浏览商店时,发现官方商店真的不好用,主要是网络原因,次要是页面设计.所以就想自己做一个游戏查询的小程序,可以关注某个游戏,然后在这个游戏打折的时候发送通知给用户.最后发现有个很大的问题是:小程序没法直接给用户推送消息(当时还不知道模板消息),服务号才能.然后就用邮箱实现了通知功能,但是邮箱的局限实在是太大了(各大免费邮箱每天的发件数都很小,自己搭建的邮件服务器虽然没有发件限制,但是大概率会被放到垃圾箱). 然后某天在微信小程序的管理后台发现了模板消息这个东西,查了会资料

随机推荐