微信小程序之一键登录+api封装

接口封装

创建http目录添加env.js文件，添加各个环境地址

module.exports={
  //开发环境url
  dev:{
   baseUrl:"http://111.com"
 },
 //测试环境得url
 test:{
   baseUrl:"http://www.test.com"
 },
 // 线上环境url
 prod:{
   baseUrl:"https://api.it120.cc"
 }
}

添加request.js

var baseUrl;
if (typeof __wxConfig == "object") {
  const version = __wxConfig.envVersion
  if (version == "develop") {
    // 工具或者真机 开发环境
    baseUrl = require("./env").dev.baseUrl
  } else if (version == "trial") {
    // 测试环境(体验版)
    baseUrl = require("./env").test.baseUrl
  } else if (version == "release") {
    // 正式环境
    baseUrl = require("./env").prod.baseUrl
  }
}
const request = {
  // 构造promise的get方法，把后端的请求结果resolve出去
  get(url, data, head) {
    const header = {
      'Authorization': wx.getStorageSync('token') || "",
    }
    return new Promise((resolve, reject) => {
      wx.request({
        method: 'get',
        url: baseUrl + url,
        data: data,
        header: head ? head : header,
        success: (res) => {
          console.log(res, 1111111)
          if (res.data.code == 0) {
            console.log(222222)
            // 调用接口成功
            resolve(res)
          }else if (res.data.code == 500) {
            wx.showToast({
              title: res.data.msg,
              icon:'none'
            })
          } else {
            console.log(333333)
            updateToken()
          }
        },
        fail: (err) => {
          reject(err)
        }
      })
    })
  },
  // 构造promise的post方法，把后端的请求结果resolve出去
  post(url, data, head) {
    const header = {
      'Authorization': wx.getStorageSync('token') || "",
    }
    return new Promise((resolve, reject) => {
      wx.request({
        method: 'post',
        url: baseUrl + url,
        data: data,
        header: head ? head : header,
        success: (res) => {
          if (res.data.code == 0) {
            // 调用接口成功
            resolve(res)
          }else if (res.data.code == 500) {
            wx.showToast({
              title: res.data.msg,
              icon:'none'
            })
          } else {
            updateToken()
          }
        },
        fail: (err) => {
          // 调用接口失败
          reject(err)
        }
      })
    })
  },
}
// 刷新token
function updateToken() {
  const token = wx.getStorageSync('token');
  wx.request({
    url: baseUrl + '/wx/getPhUserInfoByToken',
    method: 'get',
    header: {
      'token': token,
    },
    success(res) {
      let code = res.data.code
      if (code == '0') {
        wx.setStorageSync('token', res.result.token);
      } else {
        toLogin();
      }
    },
    fail: (err) => {
      // 调用接口失败
      toLogin();
    }
  })
}
// 前往登录页面 清空状态
function toLogin() {
  wx.showToast({
    title: '登录失效,请重新登录',
    icon: "none",
    success: () => {
      setTimeout(() => {
        wx.redirectTo({
          url: '/pages/login/login',
        })
      }, 1200);
    }
  })
}
module.exports = {
  request        //导出
}

api.js=>添加要调用的接口

const {request} = require("./request")  // 引入request
export function getTokenUpdate(data) {
  const url = '/getPhUserInfo'
	return request.get(url, data)
}

调用接口

const {  updatePassword } = require("../../http/api");   // 页面js文件引入

     updatePassword({
        参数一: value,
        参数二:value,
      }).then((res) => {
        if (res.data.code == 0) {
         
        }
      })

登录

流程图：

这里获取的是手机号，不是当前用户信息

 <van-button  type="primary" block color="rgba(0, 153, 255, 1)" open-type="getPhoneNumber"  bindgetphonenumber="getPhoneNumber">微信一键登录</van-button>

//点击一键登录获取手机号
  getPhoneNumber(e) {
  console.log(e)
    //用户按了允许授权按钮  
    wx.login({
      success(res) {
        if (res.code) {
        // 拿到code调登录接口
          login({
            code: res.code,
            encryptedData: e.detail.encryptedData,
            iv: e.detail.iv,
          }).then(res => {
            wx.setStorageSync('token', res.data.result.token);
            wx.navigateTo({
              url: '../first/first'
            })
            console.log(res)
          }).catch((err) => {
            console.log('error', err);
          })
        } else {
          console.log('登录失败！' + res.errMsg)
        }
      }
    })
  },