微信小程序框架wepy獲取授權

近期開發微信小程序決定使用Wepy框架,對比原生寫了一下授權登錄,在這裏記錄一下:(註釋已經寫詳細)

<script>
import wepy from 'wepy'
import 'wepy-async-function'
import { setStore } from 'wepy-redux'
import configStore from './store'
const store = configStore()
setStore(store)

export default class extends wepy.app {
  config = {
    pages: [
      'pages/index',
      'pages/charts',
      'pages/test'
   
    ],
    window: {
      backgroundTextStyle: 'light',
      navigationBarBackgroundColor: '#fff',
      navigationBarTitleText: 'WeChat',
      navigationBarTextStyle: 'black'
    }
  }

  globalData = {
    userInfo: null,
    ret:null,
    config:null,
    apiUrl:'後臺地址'
  }

  constructor () {
    super()
    this.use('requestfix')
    this.use('promisify')
  }
  onLaunch() {
    this.testAsync()
    this.init();
  }
  // 初始化獲取config
  init(){
    wepy.request('初始化後臺api').then(
      (ret)=>{
        this.globalData.config = ret.data.config;
        console.log('======初始化成功=======');
        //初始化成功判斷是否授權
        this.checkSettingStatus();
      }
    )
  }
  //判斷登錄狀態/是否授權
  async checkSettingStatus(){
    try {
      let auth = await wepy.getSetting();    //調用getSetting Api
      let authSetting = auth.authSetting;    //獲取authSetting用來判斷是否授權
      console.log('---開始判斷---');    
      if(authSetting['scope.userInfo']){
          console.log('---已經授權---');
          //已經授權情況下直接獲取userInfor
          let userInfo= await wepy.getUserInfo();    
          this.globalData.ret = userInfo;
          //調用登錄
          this.login();
      }else{
        //如果沒有授權跳轉至授權頁進行授權(新版只能通過調用按鈕來調出授權框)
        //授權頁面button需要賦予open-type='getUserInfo'屬性
        //bindgetuserinfo='scope' bind方法用來授權/獲取userInfor
        console.log('---用戶未授權---');
        wepy.navigateTo({ url: './test' });
      }
      } catch (error) {
      console.log(error)
    }
  }
  //登錄方法
 async login(){
   try {
    console.log('---調用login方法---')
    let token = wepy.getStorageSync('token') || '';    
    let {code:code} = await wepy.login();  //通過調用login獲取code 判斷是否開始登錄
     if(code){
       console.log('---獲取信息發送網絡請求---');
       let ret = this.globalData.ret
       wepy.request({
         url: '', //開發者服務器接口地址",
         data: {
           code : code,
           rawData : ret.rawData,
           token:token
         },
          method:'POST',
          header:{
            'Content-Type':'application/x-www-form-urlencoded'
          }
       }).then((res)=>{
            console.log('---網絡請求返回成功---')
           console.log(res)
           let response = res.data;
           if(response.code == 1){
             console.log('---登錄正常,返回值1---');
             console.log(response);
             this.globalData.userInfo = response.data.userInfo;
             wepy.setStorageSync('token',response.data.userInfo.token);
             console.log(this.globalData.userInfo );
           }else{
             console.log('---登錄異常---');
             wepy.setStorageSync('token','');
           }
       });
     }else{
       console.log('---login返回異常---')
     }
   } catch (error) {
    console.log(error) 
   }
    
  }
  sleep (s) {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('promise resolved')
      }, s * 1000)
    })
  }

  async testAsync () {
    const data = await this.sleep(3)
    console.log(data)
  }

  getUserInfo(cb) {
    const that = this
    if (this.globalData.userInfo) {
      return this.globalData.userInfo
    }
  }
}
</script>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章