微信小程序官方在2022年11月9日的時候,出了一則公告,公告內(nèi)容大概為:開發(fā)者不能通過wx.getUserInfo接口去獲取微信用戶頭像和昵稱了,生效期后發(fā)布的插件新版本,通過 wx.getUserInfo 接口獲取用戶頭像將統(tǒng)一返回默認(rèn)灰色頭像,昵稱將統(tǒng)一返回 “微信用戶”。生效期前發(fā)布的插件版本不受影響,但如果要進行版本更新則需要進行適配。通過 wx.login 與 wx.getUserInfo 接口獲取 openId、unionId 能力不受影響。因為微信小程序官方為了防止有人不合理收集用戶的微信昵稱頭像,收回了這接口。
然后我們會發(fā)現(xiàn),之前上線的小程序,頭像變灰了,昵稱也變成了“微信用戶”,這對用戶體驗性來說,簡直是致命打擊。作為一枚擁有極度強迫癥的攻城獅,絕對不能接受這樣的情況發(fā)生!
針對這一現(xiàn)象,我們怎么來挽救或者規(guī)避呢?微信也針對這個問題,做了一些調(diào)整,從之前的wx.getUserInfo直接獲取,改成了頭像昵稱填寫。開發(fā)者呢,則可以根據(jù)微信小程序官方指導(dǎo)文檔,進行二次處理。
下面是我個人實踐的流程和結(jié)果:
1、首先前端簡單做一個授權(quán)界面,因為我是負(fù)責(zé)后端,前端就簡單寫一下,同行勿噴!
授權(quán)框代碼
2、看一下界面效果
我這里設(shè)計的邏輯是用戶取消授權(quán)就跳回原頁面,去授權(quán)就彈出微信小程序頭像選擇框;
頭像授權(quán)
頭像選擇:
去授權(quán)微信小程序頭像
這里我們不用去管用戶到底是取消授權(quán)還是用什么頭像,只要觸發(fā)bindchooseavatar 事件,我們監(jiān)聽這個事件函數(shù),拿到頭像結(jié)果即可。
選擇微信小程序頭像,并監(jiān)聽該事件
拿到頭像之后,我們可以提示用戶填寫昵稱,當(dāng)然,如果沒有用到昵稱也可以不需要這一步,直接去登錄。
提示用戶去填寫昵稱
當(dāng)用戶點擊輸入框的時候,會自動彈出用戶微信昵稱,此時用戶點擊昵稱填入。
微信昵稱獲取
用戶也可以自行填寫,當(dāng)然,本著后端不相信前端輸入的原則,然后后端邏輯攔截一下輸入的文字內(nèi)容,有敏感詞匯的,做攔截提示處理。
用戶自定義的昵稱做名敏感詞攔截
獲取到頭像和昵稱后,因為微信提供的頭像是一個臨時路徑,不能作為微信頭像的永久路徑儲存。所以這里需要將頭像存入緩存,或者直接傳給后端存儲。我這里是前端緩存的同時,也傳給后端存儲了。
頭像昵稱獲取成功
利用文件上傳接口,傳給后端處理,去儲存或者做別的功能。
后端存儲
這樣,我們就可以愉快的接下一個項目了~
頭像昵稱獲取展示
你們又是怎么處理的呢,歡迎留言交流。下期見~