日韩av黄I国产麻豆传媒I国产91av视频在线观看I日韩一区二区三区在线看I美女国产在线I麻豆视频国产在线观看I成人黄色短片

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 前端技术 > HTML >内容正文

HTML

微信小程序获取用户的 OpenId (附前端代码)

發布時間:2023/12/20 HTML 42 豆豆
生活随笔 收集整理的這篇文章主要介紹了 微信小程序获取用户的 OpenId (附前端代码) 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
OpenId是什么?
openid 是表示用戶在你的當前應用中的唯一標識,比如小程序,微信公眾號等,這些都算是一個應用,如果你有多個應用,同一個用戶的openId可能并不相同 **下圖是獲取OpenId的過程微信的官方文檔和時序圖**

**小程序登錄的時序圖**


思路:

  • 首先調用wx.login({})獲取登錄憑證(code)
  • 調用接口前,需要把微信小程序的appid 和 secret 告知后端
  • 用拿到的code 換取 openid
  • 實例:

    App({ onLaunch: function() {var self = this;// 展示本地存儲能力var logs = wx.getStorageSync('logs') || []logs.unshift(Date.now())wx.setStorageSync('logs', logs)/** 重點來了****************|||| *********/// 登錄wx.login({success: res => {// 發送 res.code 到后臺換取 openId, sessionKey, unionIdvar Params = {code: res.code, //臨時登錄憑證key: self.globalData.MD5Key};//生成加密keyParams.key = self.MD5(Params.code + "&" + self.getNowTime() + "&" + Params.key);wx.request({url: 'https://testurl/api/test/GetOpenId', //此處填寫第三方的接口地址data: '=' + JSON.stringify(Params),header: {'content-type': 'application/json'},method: 'POST', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECTsuccess: function(res) {var openid = res.data.RntData.openid //返回openidself.globalData.openid = openid;console.log(openid);}})}})/** 重點結束|||| ********************************/// 獲取用戶信息wx.getSetting({success: res => {if (res.authSetting['scope.userInfo']) {// 已經授權,可以直接調用 getUserInfo 獲取頭像昵稱,不會彈框wx.getUserInfo({success: res => {// 可以將 res 發送給后臺解碼出 unionIdthis.globalData.userInfo = res.userInfo// 由于 getUserInfo 是網絡請求,可能會在 Page.onLoad 之后才返回// 所以此處加入 callback 以防止這種情況if (this.userInfoReadyCallback) {this.userInfoReadyCallback(res)}}})}}})} }) 是不是很好奇,為什么會多了一步,用第三方服務器去訪問微信接口的過程呢?

    如果appid和secret存在本地或者前端直接去獲取,很容易被抓包從而導致用戶信息泄露,因此,用第三方服務器去請求微信接口,能確保openID的安全性

    總結

    以上是生活随笔為你收集整理的微信小程序获取用户的 OpenId (附前端代码)的全部內容,希望文章能夠幫你解決所遇到的問題。

    如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。