首先附上官方文檔地址和授權流程

官方地址：https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/login.html

流程圖：

大致邏輯：授權 -> 發送code到服務器獲取session_key - > 保存在小程序緩存內 -> 調用wx.getUserInfo和session_key獲取用戶信息 -> 登錄成功返回訪問token -> 記錄登錄狀態 -> 執行登錄成功監聽（失敗則不監聽）

直接上代碼，一下均為小程序組件模式有興趣的可以看下官方文檔

創建components（自定義名稱）文件夾pages文件夾同級主要放置組件文件

創建 authorize （自定義名稱）文件夾 還是一樣的創建 對應的authorize.js ，authorize.wxml .authorize.wxss,authorize.json特別注意這里的 authorize.json 文件里面要定義當前頁面為組件

{"component": true}

到這里準備工作完成

authorize.js 換成組件的寫法，具體參考小程序官方文檔，這里展示我定義的

Component({  //組件的對外屬性 說的確實很官方，用過vue組件的就很容易理解這點  //父級向子級傳值這里就是接收值得地方 properties:{   //名稱要和父級綁定的名稱相同   //這里主要是控制自動授權彈框是否顯示 true=隱藏 false=顯示  iShidden:{   type:Boolean,//定義類型   value: true,//定義默認值  },  //是否自動登錄 這里主要用于沒有授權是否自動彈出授權提示框   //**用在不自動登錄頁面但是某些操作需要授權登錄**  isAuto:{   type: Boolean,   value: true,  }, }, //組件的內部數據，和 properties 一同用于組件的模板渲染 data:{  cloneIner:null }, //組件所在頁面的生命周期聲明對象 pageLifetimes:{   //頁面隱藏   hide:function(){   //關閉頁面時銷毀定時器   if(this.data.cloneIner) clearInterval(this.data.clearInterval);  },  //頁面打開  show:function(){   //打開頁面銷毀定時器   if (this.data.cloneIner) clearInterval(this.data.clearInterval);  }, }, //組件生命周期函數，在組件實例進入頁面節點樹時執行 attached(){    }, //組件的方法  methods:{  } }）;

注：以下的方法都需寫在 methods 內

第一步：未授權用戶判斷是否執行授權還是直接進行獲取用戶信息

//檢測登錄狀態并執行自動登錄  setAuthStatus(){   var that = this;   that.setErrorCount();   wx.getSetting({    success(res) {    //這里會檢測是否授權，如果授權了會直接調用自動登錄     if (!res.authSetting['scope.userInfo']) {      //沒有授權不會自動彈出登錄框      if (that.data.isAuto === false) return;       //自動彈出授權       that.setData({ iShidden: false });     } else {      //自動登錄      that.setData({ iShidden: true });      if (app.globalData.token) {      //這里是授權回調       that.triggerEvent('onLoadFun', app.globalData.token);       that.WatchIsLogin();      } else {       wx.showLoading({ title: '正在登錄中' });       //這里是已授權調用wx.getUserInfo       that.getUserInfoBydecryptCode();      }     }    }   })  }