微信小程序获取用户的 OpenId (附前端代码)
生活随笔
收集整理的這篇文章主要介紹了
微信小程序获取用户的 OpenId (附前端代码)
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
OpenId是什么?
openid 是表示用戶在你的當前應用中的唯一標識,比如小程序,微信公眾號等,這些都算是一個應用,如果你有多個應用,同一個用戶的openId可能并不相同 **下圖是獲取OpenId的過程微信的官方文檔和時序圖**
首先調(diào)用wx.login({})獲取登錄憑證(code) 調(diào)用接口前,需要把微信小程序的appid 和 secret 告知后端 用拿到的code 換取 openid
openid 是表示用戶在你的當前應用中的唯一標識,比如小程序,微信公眾號等,這些都算是一個應用,如果你有多個應用,同一個用戶的openId可能并不相同 **下圖是獲取OpenId的過程微信的官方文檔和時序圖**
**小程序登錄的時序圖**
思路:
實例:
App({ onLaunch: function() {var self = this;// 展示本地存儲能力var logs = wx.getStorageSync('logs') || []logs.unshift(Date.now())wx.setStorageSync('logs', logs)/** 重點來了****************|||| *********/// 登錄wx.login({success: res => {// 發(fā)送 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']) {// 已經(jīng)授權,可以直接調(diào)用 getUserInfo 獲取頭像昵稱,不會彈框wx.getUserInfo({success: res => {// 可以將 res 發(fā)送給后臺解碼出 unionIdthis.globalData.userInfo = res.userInfo// 由于 getUserInfo 是網(wǎng)絡請求,可能會在 Page.onLoad 之后才返回// 所以此處加入 callback 以防止這種情況if (this.userInfoReadyCallback) {this.userInfoReadyCallback(res)}}})}}})} }) 是不是很好奇,為什么會多了一步,用第三方服務器去訪問微信接口的過程呢?如果appid和secret存在本地或者前端直接去獲取,很容易被抓包從而導致用戶信息泄露,因此,用第三方服務器去請求微信接口,能確保openID的安全性
總結
以上是生活随笔為你收集整理的微信小程序获取用户的 OpenId (附前端代码)的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Oracle创建pfile spfile
- 下一篇: webpack4.x多页面零配置项目模板