微信小程序异步转同步的实现

一、参考文档

https://blog.csdn.net/Cpath/article/details/79525893

二、login等原生方法转同步

(1)引入库

bluebird.js 文件地址 https://cdn.jsdelivr.net/bluebird/latest/bluebird.min.js

(2)util.js

var Promise = require('bluebird.js')  //我用了bluebird.js 文件地址  https://cdn.jsdelivr.net/bluebird/latest/bluebird.min.js
function wxPromisify(fn) {
  return function (obj = {}) {
    return new Promise((resolve, reject) => {
      obj.success = function (res) {
        resolve(res)
      }

      obj.fail = function (res) {
        reject(res)
      }

      fn(obj)
    })
  }
}

module.exports = {
  wxPromisify: wxPromisify
}
(3)、使用方法

index.js中

var util = require('../../utils/util.js');

onLoad: function (options) {
  var that = this;
  uid = wx.getStorageSync('user_id');

  if (uid == '') {
   # 注意:wxPromisify括号中的方法不需要加括号直接wx.login, wxPromisify括号中的方法,我试了试自己定义的方法好像不可以,所以现在我用的是微信自带的方法。我的业务中暂时也只有授权用到同步..................
    var wxLogin = util.wxPromisify(wx.login);    

    wxLogin().then(function (res) {
      var data = {
        code: res.code
      };
      api._post(api.HOST_URI + 'appletsys/getUserOpenId', data, function (res) {
        wx.setStorageSync('openid', res.data.data.openid);
        wx.setStorageSync('token', res.data.data.token);
      })
    }).catch(function (res) {
      wx.showToast({
        title: '登录失败!',
        icon: 'loading',
        duration: 1000
      })
})

 

三、get post的转同步,包含第二种实现方法,简化版本

(1)util.js

const app = getApp();
const headerConfig = {
  "Content-Type": "application/json",
}
const baseUrl = "https://www.clockone.xyz/";
export function wxPromise(fn) {
  return function (obj = {}) {
    return new Promise((resolve, reject) => {
      obj.success = res => {
        resolve(res)
      };
      obj.fail = res => {
        reject(res)
      };
      fn(obj)
    })
  }
}
// 这是对post请求的封装
export function post(url, data = {}) {
  return new Promise((resolve, reject) => {
    //网络请求
    wx.request({
      url: baseUrl + url,
      data,
      method: 'POST',
      header: headerConfig,
      success: function (res) {//服务器返回数据
        resolve(res);
      },
      fail: function (error) {
        reject(error);
      }
    })
  });
}
// 这是对get请求的封装
export function get(url, data = {}) {
  return new Promise((resolve, reject) => {
    //网络请求
    wx.request({
      url: baseUrl + url,
      data,
      method: 'GET',
      header: headerConfig,
      success: function (res) {//服务器返回数据
        resolve(res);
      },
      fail: function (error) {
        reject(error);
      }
    })
  });
}

(2)、使用 index.js

import { get, wxPromise } from "utils";

getOpenID:function(){
    wxPromise(wx.login)()
    .then(res => get("/onReceiveCode", { code: res.code }))
    .then(res =>{
      console.log(res.data);
      wx.setStorageSync("openID", res.data)
    })
  },

 

//也可以在1个then中的最后一行,使用return 调用下一个方法

 

 

get("onQueryTask", { "openID": openID})
    .then(res =>{
    })

 

 

 

 

你可能感兴趣的:(Html,微信,网络pa,cho)