小程式如何獲取code

小程式如何獲取code

<button open-type="getUserInfo" hover-class='none' bindgetuserinfo="getUserInfoFun">.</button> 

wx.login({
      success: function (res) {
        var code = res.code;
        if (code) {
          console.log('獲取使用者登入憑證：' + code);

          // --------- 傳送憑證 ------------------
          wx.request({
            url: 'https://www.my-domain.com/wx/onlogin',
            data: { code: code }
          })
          // ------------------------------------

        } else {
          console.log('獲取使用者登入態失敗：' + res.errMsg);
        }
      }
    });

登入的時候需要拿到token值，需要跟後端配合才能拿到

小程式呼叫wx.login() 獲取 臨時登入憑證code ，並回傳到開發者伺服器

開發者伺服器以code換取 使用者唯一標識openid 和 會話金鑰session_key

// 登入
wx.login({
    success: res => {
        // 傳送 res.code 到後臺換取 openId, sessionKey, unionId
        // console.log(res)
        if (res.code) {
            //發起網路請求
            wx.request({
                url: 'url',
                method: 'POST',
                data: {
                    // x: '',
                    // y: ''
                    code: res.code //將code發給後臺拿token
                },
                header: {
                    'content-type': 'application/json' // 預設值
                },
                success: function(res) {
                    // 存token
                    console.log('token=' + res.data.data.token)
                    that.globalData.token = res.data.data.token; //拿到後將token存入全域性變數  以便其他頁面使用
                }
            })
        } else {
            console.log('獲取使用者登入態失敗！' + res.errMsg)
        }
    }
})

// 檢驗、登入
wx.checkSession({
    success: function() {
       //session_key 未過期，並且在本生命週期一直有效
    },
    fail: function() {
        //session_key 已經失效，需要重新執行登入流程
        wx.login({
            success: (res) => {
                if (res.code) {
                    //發起網路請求
                    wx.request({
                        //開發者伺服器通過code換取使用者唯一標識openid 和 會話金鑰session_key。
                        url: 'https://test.com/onLogin',                  
                        data: {
                            // 臨時登入憑證code，並回傳到開發者伺服器
                            code: res.code
                        },
                        success: function(result) {
                            //返回業務資料，前後端互動身份識別
                        }
                    })
                } else {
                    console.log('登入失敗！' + res.errMsg)
                }
            }
        });
    }
})

授權獲取使用者資訊

// 可以通過 wx.getSetting 先查詢一下使用者是否授權了 "scope.record" 這個 scope
wx.getSetting({
    success(res) {
        if (!res.authSetting['scope.record']) {
            wx.authorize({
                scope: 'scope.record',
                success() {
                    // 使用者已經同意小程式使用錄音功能，後續呼叫 wx.startRecord 介面不會彈窗詢問
                    wx.startRecord()
                }
            })
        }
    }
})

wx.authorize({scope: "scope.userInfo"})，無法彈出授權視窗，請使用 
<button open-type="getUserInfo"></button>

wx.getSetting({
    success: (res)=>{
        if (res.authSetting['scope.userInfo']) {
            // 已經授權，可以直接呼叫 getUserInfo 獲取頭像暱稱
            wx.getUserInfo({
              withCredentials: true,
              success: (res) => {
                  console.log(res);
              }                           
            })
        }
    }
});

授權和登入的意義
session_key 的作用
unionId 的作用，有哪些獲取途徑
在應用中如何儲存使用者登入態

新版api已廢棄wx.authorize()

wx.getUserInfo(Object object)
呼叫前需要 使用者授權 scope.userInfo。
注意：wx.authorize({scope: "scope.userInfo"})，無法彈出授權視窗，請使用

<button open-type="getUserInfo"/>

一個使用者相對於不同的微信應用會存在不同的openId

儲存使用者登入態

兩種解決方案：前端儲存和後端儲存

App({
  data:{
    titleList: [],    //資料
    wxa_session: '',  // 金鑰 
    openid: '',
    scene: ''
  },
  onLaunch: function () {   
    try {
      // 同步清理本地資料快取
      console.log('clear');
      wx.clearStorageSync()
    } catch (e) {
      // Do something when catch error
    }
 },
// 定義登入函式
userLogin:function(cb){
  var that = this
  wx.login({
    success: function (res) {
      if (res.code) {
        //發起網路請求
        wx.request({
          url: 'https://mp.weixin.qq.com/wxaintp/common?action=login&codetype=invoicediscern',
          data: {
            // 通過傳遞code獲取openID 和 金鑰
            code: res.code
          },
          success: function (res) {
            // console.log(res);
            if (res.data.base_resp.ret == 0){

              // 使用者唯一標識openid 和 會話金鑰session_key
              that.data.wxa_session = res.data.session_key;
              that.data.openid = res.data.openid;
              console.log(that.data.wxa_session);
            
              cb();   // 後續操作         
            }
            else {
              // 引數有誤
              wx.showToast({
                image: '/static/images/icon_fail@3x.png',
                title: res.data.base_resp.err_msg,
              })
              
            }               
          }
        })
      } else {
        console.log('獲取使用者登入態失敗！' + res.errMsg)
      }
    }
  });  
  globalData:{
      userInfo:null
  },
  onShow: function(options) {
        console.log('app onShow');
        console.log(options);
        var that = this;
        if(options){
          that.data.scene = options.scene;  //場景
        }    
  }  
})

App({
  // 獲取token
  getToken: function() {
    var that = this;
    if (wx.getStorageSync("token") == null || wx.getStorageSync("token") == "") {
      console.log("請使用者授權獲取token");
      wx.redirectTo({
        url: '/pages/welcome/welcome',
      })
    } else {
      wx.switchTab({
        url: '/pages/index/index',
      })
    }
  },
  // 當小程式初始化完成時，會觸發 onLaunch（全域性只觸發一次）
  onLaunch: function() {
    // 獲取小程式更新機制相容
    if (wx.canIUse('getUpdateManager')) {
      const updateManager = wx.getUpdateManager()
      updateManager.onCheckForUpdate(function(res) {
        // 請求完新版本資訊的回撥
        if (res.hasUpdate) {
          updateManager.onUpdateReady(function() {
            wx.showModal({
              title: '更新提示',
              content: '新版本已經準備好，是否重啟應用？',
              success: function(res) {
                if (res.confirm) {
                  // 新的版本已經下載好，呼叫 applyUpdate 應用新版本並重啟
                  updateManager.applyUpdate()
                }
              }
            })
          })
          updateManager.onUpdateFailed(function() {
            // 新的版本下載失敗
            wx.showModal({
              title: '已經有新版本了喲~',
              content: '新版本已經上線啦~，請您刪除當前小程式，重新搜尋開啟喲~',
            })
          })
        }
      })
    } else {
      // 如果希望使用者在最新版本的客戶端上體驗您的小程式，可以這樣子提示
      wx.showModal({
        title: '提示',
        content: '當前微信版本過低，無法使用該功能，請升級到最新微信版本後重試。'
      })
    }

    var that = this;
    that.getToken();
  },
  // 當小程式啟動，或從後臺進入前臺顯示，會觸發 onShow
  onShow: function(options) {

  },
  // 當小程式從前臺進入後臺，會觸發 onHide
  onHide: function() {

  },
  // 當小程式發生指令碼錯誤，或者 api 呼叫失敗時，會觸發 onError 並帶上錯誤資訊
  onError: function(msg) {

  },
  globalData: {
    "avatarUrl": null,
    "nickName": null,
    // userId: 使用者編號
    "userId": null,
    // organId: 所屬單位
    "organId": null,
    // idType:身份型別  
    "idType": null,


    "uncheckedNUM": null,
    "attendNum": null,
    "beLateNum": null,
    "leaveNum": null,

    "token": null,
    "studentNo": null,
  }
})

// 獲取全域性變數
const app = getApp();
Page({
  // 頁面的初始資料
  data: {
    progress_txt: '點選賬號繫結...',
  },
  // 按鈕
  drawProgressbg: function() {
    // 使用 wx.createContext 獲取繪圖上下文 context
    var ctx = wx.createCanvasContext('canvasProgressbg')
    ctx.setLineWidth(4); // 設定圓環的寬度
    ctx.setStrokeStyle('#20183b'); // 設定圓環的顏色
    ctx.setLineCap('round') // 設定圓環端點的形狀
    ctx.beginPath(); //開始一個新的路徑
    ctx.arc(110, 110, 100, 0, 2 * Math.PI, false);
    //設定一個原點(100,100)，半徑為90的圓的路徑到當前路徑
    ctx.stroke(); //對當前路徑進行描邊
    ctx.draw();
  },
  // 授權登入
  doAuthorization: function(e) {
    var that = this;
    console.log("呼叫了 doAuthorization 授權");
    // 授權 只為獲取token
    wx.login({
      success: function(res) {
        console.log("login: code", res.code);
        // 傳送至伺服器
        wx.request({
          url: '',
          method: 'POST',
          header: {
            Authorization: "",
            'Content-Type': 'application/x-www-form-urlencoded',
          },
          data: {
            mobile: 'wxecd372cca9b110e3@' + res.code,
            grant_type: 'mobile',
          },
          success: function(res) {
            // 進行判斷
            console.log("button 成功", res.data);
            console.log("button token 成功", res.data.access_token);
            if (res.data.access_token == null || res.data.access_token == "") {
              wx.showModal({
                title: '提示',
                content: '請到公眾號平臺進行繫結賬號',
                showCancel: false,
                success: function(res) {
                  console.log("請繫結賬號");
                }
              })
            } else {
              wx.setStorageSync("token", res.data.access_token);
              wx.showToast({
                title: '成功',
                icon: 'succes',
                duration: 1000,
                mask: true
              })
              setTimeout(function() {
                // 授權跳轉 index
                wx.switchTab({
                  url: '/pages/index/index',
                })
                wx.hideToast()
              }, 2000)
            }
          },
          // 失敗
          fail: function(err) {
            console.log("token 失敗", err);
            wx.showModal({
              title: '提示',
              content: '請到公眾號平臺進行繫結賬號',
              showCancel: false,
              success: function(res) {　　　　　　
                if (res.confirm) {　　　　　　　　
                  wx.navigateBack({　　　　　　　　　　
                    delta: 0　　　　　　　　
                  })　　　　　　
                }　　　　
              }
            })
          }
        })
      }
    })
  },
  // 生命週期函式--監聽頁面載入
  onLoad: function(options) {

  },
  // 生命週期函式--監聽頁面初次渲染完成
  onReady: function() {
    this.drawProgressbg();
  },
  // 生命週期函式--監聽頁面顯示
  onShow: function() {

  },
  // 生命週期函式--監聽頁面隱藏
  onHide: function() {

  },
  // 生命週期函式--監聽頁面解除安裝
  onUnload: function() {

  }
})