小程序端app.js封装请求方法

小程序端app.js封装请求方法,第1张

//app.js

App({

  onLaunch: function () {

    let App = this

    // 设置api地址

    App.setApiRoot()

  },

  globalData: {

    userInfo: null

  },

  api_root: '', // api地址

  appid:'',

  /**

   * 显示失败提示框

   */

  showError(msg, callback) {

    wx.showModal({

      title: '友情提示',

      content: msg,

      showCancel: false,

      success(res) {

        callback && callback()

      }

    })

  },

   /**

   * 设置api地址

   */

  setApiRoot() {

    let App = this

    // App.api_root = config.config.host

    let extConfig = wx.getExtConfigSync? wx.getExtConfigSync(): {}

    console.log(extConfig)

    App.appid = extConfig.attr.appid

    App.api_root = extConfig.attr.host

  },

  /**

   * get请求

   */

  _get(url, data, success, fail, complete, check_login) {

    let App = this

    wx.showNavigationBarLoading()

    // 构造请求参数

    data = Object.assign({

      token: wx.getStorageSync('token'),

      appid:App.appid  

    }, data)

    // if (typeof check_login === 'undefined')

    //   check_login = true

    console.log(App.api_root) 

    // 构造get请求

    let request = () => {

      data.token = wx.getStorageSync('token')

      wx.request({

        url: App.api_root + url,

        header: {

          'content-type': 'application/json'

        },

        data,

        success(res) { 

          if (res.statusCode !== 200 || typeof res.data !== 'object') {

            console.log(res)

            App.showError('网络请求出错') 

            return false

          } 

          if (res.data.code === -1) {

            // 登录态失效, 重新登录

            wx.hideNavigationBarLoading()

            App.doLogin(() => {

              App._get(url, data, success, fail)

            })

          } else if (res.data.code === 0) {

            App.showError(res.data.msg)

            return false

          } else {

            success && success(res.data)

          }

        },

        fail(res) {

          // console.log(res)

          App.showError(res.errMsg, () => {

            fail && fail(res)

          })

        },

        complete(res) {

          wx.hideNavigationBarLoading()

          complete && complete(res)

        },

      })

    }

    // 判断是否需要验证登录

    check_login ? App.doLogin(request) : request()

  },

  /**

   * post提交

   */

  _post_form(url, data, success, fail, complete) {

    wx.showNavigationBarLoading()

    let App = this

    // 构造请求参数 

    data = Object.assign({

      token: wx.getStorageSync('token'), 

      appid:App.appid  

    }, data)

    data.token = wx.getStorageSync('token')

    wx.request({

      url: App.api_root + url,

      header: {

        'content-type': 'application/x-www-form-urlencoded',

      },

      method: 'POST',

      data,

      success(res) {

        if (res.statusCode !== 200 || typeof res.data !== 'object') {

          App.showError('网络请求出错')

          return false

        }

        if (res.data.code === -1) {

          // 登录态失效, 重新登录

          App.doLogin(() => {

            App._post_form(url, data, success, fail)

          })

          return false

        } else if (res.data.code === 0) {

          App.showError(res.data.msg, () => {

            fail && fail(res)

          })

          return false

        }

        success && success(res.data)

      },

      fail(res) {

        // console.log(res)

        App.showError(res.errMsg, () => {

          fail && fail(res)

        })

      },

      complete(res) {

        wx.hideLoading()

        wx.hideNavigationBarLoading()

        complete && complete(res)

      }

    })

  },

   /**

   * 验证登录

   */

  checkIsLogin() {

    return wx.getStorageSync('token') != ''

  }, 

  /**

   * 授权登录

   */

  doLogin(callback) { 

    let App = this

    // if (e.detail.errMsg !== 'getUserInfo:ok') {

    //   return false

    // }

    wx.showLoading({

      title: "加载数据中...",

      mask: true

    }) 

    // 执行微信登录

    wx.login({ 

      success(res) {

        // 发送用户信息 

        App._post_form('login', {

          code: res.code,

        }, result => {

          // 记录token user_id

          wx.setStorageSync('token', result.data.token,)

          // 执行回调函数

          callback && callback()

        }, false, () => {  

          wx.hideLoading()

        })

      }

    }) 

  }

})

电脑微信登入小程序数字信封解密失败是回调中调用wx.login登录,会刷新登录态。。此时服务器使用code换取的sessionKey不是加密时使用的sessionKey,导致解密失败。解决方法是开发者提前进行login。或者在回调中先使用checkSession进行登录态检查,避免login刷新登录状态。

传统的web开发实现登陆功能,一般的做法是输入账号密码、或者输入手机号及短信验证码进行登录。

服务端校验用户信息通过之后,下发一个代表登录态的 token 给客户端,以便进行后续的交互,每当token过期,用户都需要重新登录。

而在微信小程序中,可以通过微信官方提供的登录能力方便地获取微信提供的用户身份标识,快速建立小程序内的用户体系,从而实现登陆功能。

实现小程序用户体系主要涉及到openid和code的概念:

1.调用wx.login()方法会生成code,将code作为参数传递给微信服务器指定接口,就可以获取用户的openid。

2.对于每个小程序,微信都会将用户的微信ID映射出一个小程序 openid,作为这个用户在这个小程序的唯一标识。

微信小程序登陆具体实现的逻辑如下图所示:

更加详细的功能图如下所示:

实际业务中,我们还需要登录态是否过期,通常的做法是在登录态(临时令牌)中保存有效期数据,该有效期数据应该在服务端校验登录态时和约定的时间(如服务端本地的系统时间或时间服务器上的标准时间)做对比。

这种方法需要将本地存储的登录态发送到小程序的服务端,服务端判断为无效登录态时再返回需重新执行登录过程的消息给小程。

另一种方式可以通过调用wx.checkSession检查微信登陆态是否过期:

1.如果过期,则发起完整的登录流程

2.如果不过期,则继续使用本地保存的自定义登录态

这种方式的好处是不需要小程序服务端来参与校验,而是在小程序端调用AP,流程如下所示:


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/11253062.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-14
下一篇 2023-05-14

发表评论

登录后才能评论

评论列表(0条)

保存